cookie、localStorage、sessionStorage、session

關於標題提到的幾個名詞,相信大家都不會陌生,在做前端的時候是非常常見的。這裏再次溫習加深一下印象。

cookie、localStorage、sessionStorage都是用作瀏覽器緩存。

先介紹區別:

1. 存放數據大小

cookie:4kb左右

localStorage、sessionStorage:5mb左右

2. 存放時間

cookie:一般由服務器來生成,服務器可設置數據失效的時間(即有效期),客戶端也可生成cookie, 默認是關閉瀏覽器即清除。

localStorage: 數據永久保存,除非手動清除。

sessionStorage:(顧名思義:session 對話的意思)即僅在當前會話有效,關閉瀏覽器或當前對話標籤頁數據即清除。

3. 應用場景

cookie:cookie一般比較小,所以較常用來保存用戶的登錄信息狀態

一般在登錄頁面用戶登錄成功時,後端返回相應的用戶獨一的token字段,並設置相應的失效時間,前端拿到相應的token字段後,接下來的請求都帶上這個相應的token字段,進行相應的用戶身份驗證。若cookie相應的字段失效,即可跳轉到相應的登錄頁,讓用戶重新登錄,即達到保存用戶登錄狀態的效果。同樣的道理,利用這個想法,也可製作用戶的默認登錄,同樣利用相應的token等字段,在用戶訪問我們的網站首頁時,判斷相應的token是否失效,若不失效,即表示用戶可默認登錄,若超過一定的期限失效,用戶即可重新登錄。

localStorage、sessionStorage:由於這兩個可以存放的數據較爲大, 因此應用場景其實見仁見智,主要看自己的需求,如博主在項目開發中遇到一個問題,即需記錄當前頁面由哪個頁面跳轉過來,當時博主利用了sessionStorage進行相應的記錄,跳轉到新頁面之後,通過判斷sessionStorage的字段判斷是否由指定的頁面跳轉過來,即可進行相應的判斷。或者說,有一些頁面的數據不需頻繁更新,不需要一直向後臺請求相應的數據,也可存放到localStorage或sessionStorage中,進行相應的緩存記錄,達到網站性能優化的結果。

4. 關於session

session在面試過程或者筆試過程中,也常用來與上面幾個字段混淆。

session是保存在服務器端的。思想跟cookie有點像,後端也常session來保存用戶的登錄信息狀態。(由於博主以學前端爲主,所以這一塊感興趣的同學,可以再查閱相應的資料進行進一步的瞭解)

emm, 還有,博主一直沒放棄自己的公衆號,雖然更新頻率沒有非常大,但是如果寫了相應的文章就會進行相應的記錄,希望能跟大家一起學習進步,期待您的關注!

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章