JS 筆記 | localstorage是什麼
瀏覽器如何記錄資料現在瀏覽器非常聰明,為了提升使用者體驗好感度,會發現到很多網站的帳號、密碼都只要輸入一次就可以了,下次再登入就會被記得,甚至上次瀏覽過的購物商品,今天再打開網頁時,會出現瀏覽紀錄!到底是怎麼做到的?是透過這三種方式記錄的(可透過chrome開發人員工具中的Application標籤找到):LocalStorageSessionStorageCookieLocalStorage基本介紹在HTML5中,新加入了一個localStorage特性,此特性主要是用來作為本地儲存來使用的,解決了cookie儲存空間不足的問題。localStorage中一般瀏覽器支援的是5M大小(在不同的...
瀏覽器如何記錄資料現在瀏覽器非常聰明,為了提升使用者體驗好感度,會發現到很多網站的帳號、密碼都只要輸入一次就可以了,下次再登入就會被記得,甚至上次瀏覽過的購物商品,今天再打開網頁時,會出現瀏覽紀錄!到底是怎麼做到的?
是透過這三種方式記錄的( 可透過 chrome 開發人員工具中的 Application 標籤找到):
LocalStorage SessionStorage Cookie LocalStorage 基本介紹在 HTML5 中,新加入了一個 localStorage 特性,此特性主要是用來作為本地儲存來使用的,解決了 cookie 儲存空間不足的問題。
localStorage 中一般瀏覽器支援的是 5M 大小 ( 在不同的瀏覽器中 localStorage 會有所不同 )。cookie 的儲存空間為 4k。
localStorage 的優勢與侷限拓展了 cookie 的 4K 限制。 瀏覽器儲存在本地端的資料,格式為 key, value。需要注意的是「value 的型態只有 String」!會可以將第一次請求的資料直接儲存到本地,這個相當於一個 5M 大小的針對於前端頁面的資料庫,相比於 cookie 可以節約頻寬,但是這個卻是只有在高版本的瀏覽器中才支援的
在 IE8 以上版本才支援這個屬性。 目前所有的瀏覽器中都會把 localStorage 的值 ( key, value ) 型別限定為 string ,需要透過 JSON 轉換型別。 在瀏覽器的隱私模式是不可讀取的。 基本上是對 string 的讀取,如果儲存內容多的話會消耗記憶體空間,會導致頁面卡頓。 無法被爬蟲[1]抓取到。 localStorage 與 sessionStorage 的差異這兩者常一起講,因為幾乎都相同,唯一的區別只有:
localStorage 屬於永久性儲存。 sessionStorage 屬於當結束網頁的時候,sessionStorage 中的鍵值對會被清空。sessionStorage 介紹[2]。
localStorage 的存取基本操作會使用下方兩個屬性存取 localStorage 的值。...