网络异常,图片无法展示
|
Cookie
- Cookie 在同域下会伴随着每一次资源请求的请求报头传递到服务端进行验证:避免无效资源传输及性能浪费。
- Cookie 无法跨域携带:将 CDN 的域名与主站区分开来来避免传输cookie带来的性能浪费。
- 存储空间很小,不能超过 4KB
- js-cookie库:优化原生cookie api
使用:
服务端登录接口可以在返回前端的响应报头中设置首部字段 set-cookie
来将 token 信息植入浏览器 cookie 中,set-cookie 指令值包含了必选项 <cookie-name>=<cookie-value>
值和名的形式,同时还包括了可选项 Path(路径)、Domain(域名)、Max-Age(有效时间)等,以分号分隔。
服务端可以返回多个 set-cookie 指令来达到设置多个 cookie 的目的。最终我们可以在开发者工具 Application 面板中查看当前网页设置的 cookie 值。
之后前端调用任何同域下的接口时,浏览器会自动将网站的 cookie 值附加在请求头中传给后端进行校验,前端则不需要关心 token 的存取问题。
很多网站就用这种方式来存储登录状态,但是这种方式只适用于浏览器方式,小程序等就不适用了。
Web Storage
Web Storage
是 HTML5 推出的浏览器存储机制,其又可分为 Session Storage
和 Local Storage
,两者相辅相成。
使用Web Storage
的缺点是,前端少不了一些繁碎的序列化与反序列化操作。
IndexedDB
略