天天看點

Cookie,Session,LocalStorage和SessionStorage的差別?

Cookie

1. 伺服器通過 Set-Cookie 頭給用戶端一串字元串

2. 用戶端每次通路相同域名的網頁時,必須帶上這段字元串

3. 用戶端要在一段時間内儲存這個Cookie

Session

1. 将SessionID(随機數)通過Cookie發給用戶端

2. 用戶端通路伺服器時,伺服器讀取SessionID

3. 伺服器有一塊記憶體(哈希表)儲存了所有Session

4. 通過SessionID,我們可以得到對應的使用者隐私資訊,如id,email

5. 這塊記憶體(哈希表)就是伺服器上的所有Session

LocalStorage

1. LocalStorage跟HTTP無關

2. HTTP不會帶上LocalStorage的值

3. 隻有相同域名的頁面才能互相讀取LocalStorage(沒有同源那麼嚴格)

4. 每個域名LocalStorage最大儲存量為5MB左右(每個浏覽器不一樣)

5. 常用場景:記錄有沒有提示過使用者(沒有用的資訊,不能記錄密碼)

SessionStorage

1. 2. 3. 4. 5. 點與LocalStorage相同

6. SessionStorage 非永久有效,目前會話(頁面)結束後失效

Cookie 和 LocalStorage 的差別?

Cookie

1. 是由請求頭 響應頭 傳送資料的

2.每個域名的 cookie的最大存儲量為4KB左右

LocalStorage

1. LocalStorage與http無關

2. http不會帶上LocalStorage的值

3. 每個域名的 LocalStorage的最大存儲量為5M左右

4. LocalStorage永久有效,除非使用者清理緩存

LocalStorage 和 SessionStorage 的差別?

LocalStorage永久有效,除非使用者清理緩存

SessionStorage 目前會話有效,關閉目前會話後會被清理

Cookie 如何設定過期時間?如何删除 Cookie?

Cookie 如何設定過期時間

伺服器端:response.setHeader('Set-Cookie','Lucy=18;Expires =Thu, 23 May 2019 07:52:15 GMT')

用戶端:document.cookie = "Lucy=18;expires=Fri, 31 Dec 2020 23:59:59 GMT";

删除cookie

JavaScript并沒有内置接口直接删除cookie,但是可以利用曲線救國的辦法來實作删除功能

将cookie的過期時間設定為過去的時間就可以了

Cache-Control: max-age=1000 緩存 與 ETag 的「緩存」有什麼差別?

Cache-Control: max-age=1000

是指的目前時間往後1000秒之内不請求新檔案 由浏覽器計算時間

ETag 的 緩存

則是初次請求時将檔案通過MD5加密後得到的資訊摘要由響應頭傳回, 此後的請求時請求頭會帶上這段資訊摘要與伺服器的檔案摘要進行比對,如果一緻則使用本地檔案,如果不同則再從伺服器上下載下傳。