国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

sessionStorage和localStorage

wujl596 / 2380人閱讀

摘要：前端存儲和簡述曾在項目中多次使用過和來存放，但一直未深入了解。以為例他們均只能存儲字符串類型的對象存儲大小都為都遵守同源策略不同點(diǎn)有期限，當(dāng)窗口或瀏覽器關(guān)閉時就會被銷毀。本文如有錯誤，歡迎指出。

H5前端存儲 localStorage 和 sessionStorage 簡述

曾在項目中多次使用過localStorage和sessionStorage來存放token，但一直未深入了解。近期項目壓力極小，就看了很多文章研究了一下，并結(jié)合項目經(jīng)驗做個總結(jié)。

session 和 sessionStorage，Java 和 JavaScript

在徹底弄懂session,cookie,token中，我已經(jīng)講過session。在我學(xué)習(xí)sessionStorage的過程中，看到很多文章的評論說：sessionStorage不是存在服務(wù)器的嗎？在這里，我說明一下，session是存放于服務(wù)器的一個狀態(tài)集合，而sessionStorage是H5新引入的一個客戶端存儲數(shù)據(jù)的空間，與session并無關(guān)系，大家千萬不要搞混了。就像Java和JavaScript，只是名字長得像而已。localStorage和sessionStorage之間有些異同，可以進(jìn)行比較

用法

用法很簡單，sessionStorage和localStorage的api一樣。

// 保存數(shù)據(jù)到sessionStorage
sessionStorage.setItem("key", "value");

// 從sessionStorage獲取數(shù)據(jù)
const data = sessionStorage.getItem("key");

// 從sessionStorage刪除保存的數(shù)據(jù)
sessionStorage.removeItem("key");

// 從sessionStorage刪除所有保存的數(shù)據(jù)
sessionStorage.clear();

// 從sessionStorage獲取全部數(shù)據(jù)
const allData=sessionStorage.valueOf();
異同 相同點(diǎn)

localStorage和sessionStorage一樣都是用來存儲客戶端臨時信息的對象。以chrome為例

他們均只能存儲字符串類型的對象

存儲大小都為5M

都遵守同源策略

不同點(diǎn)

sessionStorage有期限，當(dāng)窗口或瀏覽器關(guān)閉時就會被銷毀。localStorage無限期，關(guān)閉瀏覽器后仍存在，除非用戶手動在瀏覽器UI層刪除

localStorage 在同源的不同窗口下可共享，在不同瀏覽器中不可共享

sessionStorage 在同源的不同窗口下不可共享。注意這里的不同窗口是指瀏覽器另起一窗口，并不是指頁面路由跳轉(zhuǎn)

小結(jié)

在我做過的項目中，storage一般用來存儲少量的用戶信息和token，建議大家不要把什么數(shù)據(jù)都放在 localStorage 和 sessionStorage中，畢竟前端的安全性太低。只要打開控制臺就可以任意的修改localStorage 和 sessionStorage的數(shù)據(jù)。重要的信息最好還是放在后臺。

謝謝

最后 如果大家有疑惑可以隨便找一個小說網(wǎng)站在控制臺試一試，很快便可掌握。
本文如有錯誤，歡迎指出。

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/100915.html

相關(guān)文章

  • 印象最深的一個bug：sessionStorage緩存在移動端失效

    摘要：移動端緩存失效是我印象最深的一個之一，為啥呢，因為這個問題導(dǎo)致我加班到很晚。的生命周期是僅在當(dāng)前會話下有效。引入了一個瀏覽器窗口的概念，是在同源的窗口中始終存在的數(shù)據(jù)。無bug，不程序：作為程序員的我，不是修bug就是在寫bug的路上。　　移動端sessionStorage緩存失效是我印象最深的一個bug之一，為啥呢，因為這個問題導(dǎo)致我加班到很晚。在現(xiàn)在看來就是一個簡單的概念問題。在我剛工作...

    yuxue 評論0 收藏0

  • sessionStorge和localStorage的使用-踩坑記_09

    摘要：的使用屬性允許你訪問一個對象。它與相似，不同之處在于里面存儲的數(shù)據(jù)沒有過期時間設(shè)置，而存儲在里面的數(shù)據(jù)在頁面會話結(jié)束時會被清除。頁面會話在瀏覽器打開期間一直保持，并且重新加載或恢復(fù)頁面仍會保持原來的頁面會話。 sessionStorge的使用 sessionStorage 屬性允許你訪問一個 session Storage 對象。它與 localStorage 相似，不同之處在于 lo...

    Jochen 評論0 收藏0

  • sessionStorge和localStorage的使用-踩坑記_09

    摘要：的使用屬性允許你訪問一個對象。它與相似，不同之處在于里面存儲的數(shù)據(jù)沒有過期時間設(shè)置，而存儲在里面的數(shù)據(jù)在頁面會話結(jié)束時會被清除。頁面會話在瀏覽器打開期間一直保持，并且重新加載或恢復(fù)頁面仍會保持原來的頁面會話。 sessionStorge的使用 sessionStorage 屬性允許你訪問一個 session Storage 對象。它與 localStorage 相似，不同之處在于 lo...

    PrototypeZ 評論0 收藏0

  • 客戶端數(shù)據(jù)存儲 --- web storage From 《高程3》

    摘要：的目的就是取代進(jìn)行大量的本地數(shù)據(jù)存儲，其中不能進(jìn)行跨會話存儲，這可以使用彌補(bǔ)。刪除由指定的名值對兒。使用方法存儲數(shù)據(jù)使用屬性存儲數(shù)據(jù)使用方法讀取數(shù)據(jù)使用屬性讀取數(shù)據(jù)一般來說，對存儲空間大小的限制都是以每個源協(xié)議域和端口為單位的。 前言 本文首先介紹web storage和Cookie的對比，解釋web storage的優(yōu)勢；隨后指出怎樣使用插firebug插件的擴(kuò)展firestorag...

    wangbinke 評論0 收藏0

發(fā)表評論

0條評論

wujl596

男|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<