本地存盤常用方式 localStorage, sessionStorage，cookie 的區別和服務器存盤session-有解無憂

本地存盤：把一些資訊存盤到客戶端本地（主要目的有很多，其中有一個就是實作多頁面之間的資訊共享） 1. 離線快取(xxx.manifest) H5處理離線快取還是存在一些硬傷的，所以真實專案中一般還是傳統的NATIVE APP來完成這件事情 2. localStorage / sessionStorage：H5中新增加的API，基于這個API可以把一些資料快取到客戶端本地（常用） 3. IndexedDB / webSQL ：本地資料庫存盤 4. Cookie：本地資訊存盤（常用） 5. CacheStorage / ApplicationCache：本地快取存盤

用到本地存盤的地方： [頁面之間資訊的通信] A存盤資訊，B頁面中可以獲取 1. 登錄 2. 記住用戶名密碼（或者自動登錄） 3. 購物車 4. 跳轉到其它頁面，回傳上級頁面的時候停留在之前最后一次我們來看看本地存盤cookie和服務端session的具體做法及使用場景

[做一些性能優化]        把一些不經常改變的資料，在第一次從服務器端獲取到之后，存盤到客戶端本地（記錄一個存盤時間），假設我們設定有效存盤期是10分鐘，那么10分鐘以內，我們再重繪頁面，就不用再向服務器發送請求了，直接從本地資料中獲取展示即可；超過10分鐘，從新向服務器發送請求，請求回來最新資料參考第一次，也一樣存盤到本地中... 1. 可減輕服務器壓力 2. 對于不經常更新的資料我們可以把存盤周期設定的長一些，有助于頁面第二次加載的時候，渲染的速度（移動端經常做這些事情） localStorage VS cookie       [cookie]          1.兼容所有的瀏覽器          2.有存盤的大小限制，一般一個源（一個域下）只能存盤4KB內容          3.cookie有過期時間(當然我們自己可以手動設定這個時間)          4.殺毒軟體或者瀏覽器的垃圾清理都可能會把cookie資訊強制清除掉          5.在隱私或者無痕瀏覽模式下，是不記錄cookie的          6.cookie不是嚴格的本地存盤，因為要和服務器之間來回傳輸
      [localStorage]          1.不兼容IE8及以下          2.也有存盤的大小限制，一個源下最多只能存盤5MB左右          3.本地永久存盤，只要你不手動洗掉，永遠存盤在本地（但是我們可以基于API  removeItem/clear手動清除一些自己想要洗掉的資訊）          4.殺毒軟體或者瀏覽器的垃圾清理暫時不會清除localStorage（新版本谷歌瀏覽器會清除localStorage等資訊）          5.在隱私或者無痕瀏覽模式下，是記錄localStorage的          6.localStorage和服務器沒有半毛錢關系　　       真實專案中使用本地存盤來完成一些需求的情況不是很多，一般都是基于服務器的session或者資料庫存盤完成的（服務器的session和本地的cookie是有關聯的），如果不考慮兼容，就想基于本地存盤來完成一些事情，那么一般都是用localStorage的（尤其是移動端開發）
      localStorage.setItem([key],[value])：[value]必須是字串格式的（即使寫的不是字串，也會默認轉換為字串）       localStorage.getItem([key])：通過屬性名獲取存盤的資訊       localStorage.removeItem([key])：洗掉指定的存盤資訊       localStorage.clear()：清除當前域下存盤的所有資訊       localStorage.key(0)：基于索引獲取指定的KEY名
      document.cookie='';//=>設定cookie

轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/165951.html

標籤：JavaScript

上一篇：JS---課程介紹 + JavaScript分三個部分

下一篇：JS---體驗DOM操作

本地存盤常用方式 localStorage, sessionStorage，cookie 的區別 和 服務器存盤session

本地存盤常用方式 localStorage, sessionStorage，cookie 的區別和服務器存盤session