Cookie与Storage的使用
很多小伙伴都知道,本地存储用的大多数是cookie,还有用的是sessionStorage和localStorage,当时他们具体是怎么使用的呢,又有哪些区别?
Cookie
一、 使用cookie(cookie存储大小约4K)
在使用cookie之前首先导入 jquery.js 和 jquery.cookie.js 文件,
二、 DOM 原生方法:
1 | //存: |
三、 jquery 方法:
1 | //存: |
注意:第三个参数可以是{expires:n},表示存储多少天,否则关闭浏览器后消失
使用cookie的弊端
Cookie数量和长度的限制。每个domain最多只能有20条cookie,每个cookie长度不能超过4KB,否则会被截掉。
安全性问题。如果cookie被人拦截了,那人就可以取得所有的session信息。即使加密也与事无补,因为拦截者并不需要知道cookie的意义,他只要原样转发cookie就可以达到目的了。
有些状态不可能保存在客户端。例如,为了防止重复提交表单,我们需要在服务器端保存一个计数器。如果我们把这个计数器保存在客户端,那么它起不到任何作用。
Storage
sessionStorage的使用 (大小约为5MB)
1 | //存: |
localStorage的使用(本地储存)
有效期-除非手动清除,否则会一直存在,同一个域使用
localStorage 与 sessionStorage 的使用方法一样
离线缓存
首先npm init 和 express
第一步:html里manifest 设置离线文件
<html manifest="index.manifest">~~~=号里的是文件的名字
第二步:配置index.manifest文件
CACHE MANIFEST # 这句一定要写 #是注释符号
# 2017-08-23 v1.0.0
# 缓存文件列表-----缓存什么就写什么
CACHE:
index.html
images/0.jpg
jquery/jquery.js
js/Music.js
mp3/click.mp3
# 不缓存的文件列表
NETWORK:
index.manifest
# 离线失败时显示的页面
FALLBACK:
html/index.html
第三步:
文件改变,用户不会手动清缓存,如果index.manifest 文件发生改变,会自动执行下面监听方法
1 | window.applicationCache.addEventListener('updateready',function(){ |
补充一个MD5加密
//首先要有md5.js
var name = hex_md5("陈晟");
//得到一串乱码,不能逆向
以上就是我对Cookie的一些理解,不足之处希望大牛们多提一些意见,感激不尽
-------------本文结束感谢您的阅读-------------