三種本地儲存方式

2021-08-14 02:54:18 字數 1017 閱讀 5695

當網頁要發http請求時,瀏覽器會先檢查是否有相應的cookie,有則自動新增在request header中的cookie欄位中。這些是瀏覽器自動幫我們做的,而且每一次http請求瀏覽器都會自動幫我們做。這個特點很重要,因為這關係到「什麼樣的資料適合儲存在cookie中」。

儲存在cookie中的資料,每次都會被瀏覽器自動放在http請求中,如果這些資料並不是每個請求都需要發給服務端的資料,瀏覽器這設定自動處理無疑增加了網路開銷;但如果這些資料是每個請求都需要發給服務端的資料(比如身份認證資訊),瀏覽器這設定自動處理就大大免去了重複新增操作。所以對於那種設定「每次請求都要攜帶的資訊(最典型的就是身份認證資訊)」就特別適合放在cookie中,其他型別的資料就不適合了。

客戶端設定

最常用的例子就是讓 cookie 在根目錄下,這樣不管是哪個子頁面建立的 cookie,所有的頁面都可以訪問到了。

document.cookie = "username=cfangxu; path=/"

特徵:乙個網域名稱下存放的cookie的個數是有限制的,不同的瀏覽器存放的個數不一樣,一般為20個。

每個cookie存放的內容大小也是有限制的,不同的瀏覽器存放大小不一樣,一般為4kb。

cookie也可以設定過期的時間,預設是會話結束的時候,當時間到期自動銷毀

html5新方法,不過ie8及以上瀏覽器都相容。

特點localstorage.setitem('username','cfangxu');

localstorage.getitem('username')

也可以獲取鍵名 

localstorage.key(0) #獲取第乙個鍵名

localstorage.remove('username')

也可以一次性清除所有儲存 

localstorage.clear()

其實跟localstorage差不多,也是本地儲存,會話本地儲存

三種本地儲存

前端常用的三種本地儲存策略是什麼呢?cookie sessionstorage localstorage cookie 在 h5 之前,本地儲存的主要方式就是 cookie cookie可以實現少量資料的儲存。為什麼是少量?因為 cookie 有 4k 的限制,沒辦法儲存資料量較大的資料 cooki...

三種本地儲存策略的區別

前端常用的三種本地儲存策略是什麼呢?cookie sessionstorage localstorage 在 h5 之前,本地儲存的主要方式就是 cookie cookie可以實現少量資料的儲存。為什麼是少量?因為 cookie 有 4k 的限制,沒辦法儲存資料量較大的資料 cookie 的使用 獲...

本地儲存方式比較

由於最近有項工作要用到本地儲存方式來儲存使用者的一些資訊,所以花了點時間蒐集了一下現有的一些本地儲存方式,並做了一些比較,在這裡做個記錄,以後遇到類似的問題,要用什麼方法心中也多少有個數。目前已有的本地儲存方式 一 傳統的 1.cookie 各瀏覽器都基本支援,可控制生命週期,但缺點是有大小限制,1...