一、说一说 cookie sessionStorage localStorage 区别？
得分点
数据存储位置、生命周期、存储大小、写入方式、数据共享、发送请求时是否携带、 安全性、浏览器兼容性、使用方法、应用场景、
标准回答
Cookie、SessionStorage、 LocalStorage 都是浏览器的本地存储。
它们的共同点
都是存储在浏览器本地的
它们的区别
cookie 是由服务器端写入的，而 SessionStorage、 LocalStorage 都是由前端写入的;
cookie 的生命周期是由服务器端在写入的时候就设置好的，LocalStorage 是写入就一直存在，除非手动清除，SessionStorage 是页面关闭的时候就会自动清除。
cookie 的存储空间比较小大概 4KB，SessionStorage、 LocalStorage 存储空间比较大，大概 5M。
Cookie、SessionStorage、 LocalStorage 数据共享都遵循同源原则，SessionStorage 还限制必须是同一个页面。如果一个浏览器同时打开两个 tab，localstorage 和 cookie 是共享的，sessionstorage 是不共享的，这个在处理同一个浏览器登录多个用户的时候会用到。
在前端给后端发送请求的时候会自动携带 Cookie 中的数据，但是 SessionStorage、 LocalStorage 不会
cookie 本身并不安全，考虑到安全应当使用 session。
cookie 兼容性完全没问题；localStorage 和 sessionStorage 也支持 IE8+ 的浏览器，基本都可以正常使用。
localstorage,sessionstorage 在浏览器无痕模式下会存在丢失问题。
加分回答
由于它们的以上区别，所以它们的应用场景也不同，Cookie 一般用于存储登录验证信息 SessionID 或者 token，LocalStorage 常用于存储不易变动的数据，减轻服务器的压力，SessionStorage 可以用来检测用户是否是刷新进入页面，如音乐播放器恢复播放进度条的功能。
cookie 的使用
cookie 可通过 document.cookie 获取全部 cookie。它是一段字符串，是键值对的形式。操作起来有些麻烦，可引入封装好的库进行使用，比如 js-cookie点我。API 也很简洁：
csharp
代码解读
复制代码
Cookies.set("name", "value", { expires: 7 }); // 设置一个cookie，7天后失效 Cookies.get("name"); // => 'value' Cookies.remove("name");
localStorage 和 sessionStorage 的使用
javascript
代码解读
复制代码
localStorage.setItem("name", "value"); localStorage.getItem("name"); // => 'value' localStorage.removeItem("name"); localStorage.clear(); // 删除所有数据 sessionStorage.setItem("name", "value"); sessionStorage.setItem("name"); sessionStorage.setItem("name"); sessionStorage.clear();
注意事项：
- localStorage 写入的时候，如果超出容量会报错，但之前保存的数据不会丢失。
- localStorage 存储容量快要满的时候，getItem 方法性能会急剧下降。
- web storage 在保存复杂数据类型时，较为依赖
JSON.stringify，在移动端性能问题比较明显。
二、说一说 cookie 和 session 区别
得分点
数据存储位置、安全性、服务器性能消耗、存储大小和个数
标准回答
它们的共同点
cookie 和 session 都是普遍用来跟踪浏览用户身份的会话方式。
不同点
cookie 数据存放在客户端，session 数据放在服务器端。
cookie 本身并不安全，考虑到安全应当使用 session。
session 会在一定时间内保存在服务器上。如果访问量比较大，会比较消耗服务器的性能。考虑到减轻服务器性能方面的开销，应当使用 cookie 。
单个 cookie 保存的数据不能超过 4K，很多浏览器都限制一个域名最多保存 50 个 cookie。 将登陆信息等重要信息存放为 session、其他信息如果需要保留，可以放在 cookie 中。