cookie與webStorage的區別

2021-10-10 11:54:00 字數 843 閱讀 3447

cookie

儲存容量最大不能超過4kb;

安全性較低,每次請求cookie都會被攜帶到伺服器端,且以明文方式儲存,一旦被攔截,資訊則會被獲取。

webstorage分為sessionstorage和localstorage,且在請求時不會攜帶到伺服器端。

sessionstorage

會話儲存:

儲存級別為會話級,儲存的內容只在當前會話有效,會話關閉,資料會被清除。

通過setitem來向sessionstorage中傳值,引數為鍵值對;

sessionstorage.

setitem

('key'

,'value'

);

通過getitem來獲取儲存中的值,引數為屬性名;

sessiontorage.

getitem

('key'

);

通過removeitem來刪除單個資料,引數為屬性名;

sessiontorage.

removeitem

('key'

);

通過clear來完全清除儲存;

sessionstorage.

clear()

;

localstorage

本地儲存:除非手動清除,否則關閉當前會話甚至於在關閉瀏覽器時候資料依舊會儲存。

擁有和sessionstorage相同的方法來新增獲取和清除值。

Html5中拖放API與WebStorage

任何元素都能夠拖放,並且支援瀏覽器與其他應用程式之間的資料的互相拖放,同時大大簡化了拖放方面的相關 將想要拖放的物件元素的draggable屬性設為true,另外img與a元素預設允許拖放 編寫與拖放相關的事件處理 1 在目標元素內移動 dragover 將拖放元素放置到目標元素內 2 通過gete...

secrage 可加解密的 webStorage

好吧說加解密是有些誇張了,主要是利用 window.btoa atob 編碼 key value,以達到隱藏資訊的目的。雖然沒有真正的加密,但是總比直接明文儲存資料要 優雅 些對吧 用法 npm install secrage s import from secrage sessionstorage...

js儲存cookie與讀取cookie

設定cookie param name param value function setcookie name,value path引數巨坑!一般設定之後頁面都可以訪問cookie,否則只能在乙個頁面。功能 獲取cookies函式 引數 cookie name名字 function getcooki...