cookies vs本地存储与会话存储
#javascript #localstorage #cookies #sessionstorage

饼干

cookie是数据,存储在计算机上的小文本文件中。

// Create a Cookie with JavaScript
document.cookie = "username=Manthan Ankolekar";

// With expiry date (in UTC time)
document.cookie = "username=Manthan Ankolekar; expires=Thu, 28 Apr 2013 12:00:00 UTC";

// With a path parameter
document.cookie = "username=Manthan Ankolekar; expires=Thu, 28 Apr 2013 12:00:00 UTC; path=/";

// Read a Cookie with JavaScript
let data = document.cookie;

// Change a Cookie with JavaScript
document.cookie = "username=Manthan Ank; expires=Thu, 28 Apr 2013 12:00:00 UTC; path=/";

// Delete a Cookie with JavaScript
document.cookie = "username=; expires=Thu, 28 Apr 2013 12:00:00 UTC; path=/";

本地存储

本地存储对象让您将键/值对存储在浏览器中。

语法 -

window.localStorage
// or
localStorage
// Save Data to Local Storage
localStorage.setItem(key, value);

// Read Data from Local Storage
let data = localStorage.getItem(key);

// Remove Data from Local Storage
localStorage.removeItem(key);

// Remove All (Clear Local Storage)
localStorage.clear();

会话存储

会话存储对象允许您将键/值对保存在浏览器中。

语法 -

window.sessionStorage
// or
sessionStorage
// Save Data to Session Storage
sessionStorage.setItem("key", "value");

// Read Data from Session Storage
let data = sessionStorage.getItem("key");

// Remove Data from Session Storage
sessionStorage.removeItem("key");

// Remove All (Clear Session Storage)
sessionStorage.clear();

cookie与本地存储与Sesssion存储之间的区别

中 发送
cookie 本地存储 会话存储
stoage容量 4KB 10MB 5MB
浏览器支持 html4/html5 html5 html5
可访问性 任何浏览器窗口 任何浏览器窗口 相同的浏览器选项卡
有效期 可以手动设置 从不 在浏览器选项卡上关闭
存储在浏览器和服务器 仅浏览器 仅浏览器
已发送请求
支持的数据类型 仅字符串 仅字符串 仅字符串
自动到期
编辑/块
SSL支持