Cookie
1.服务器通过 Set-Cookie 头给客户端一串字符串
2.客户端每次访问相同域名的网页时,必须带上这段字符串
3.客户端要在一段时间内保存这个Cookie
4.Cookie默认在用户关闭页面后就失效,后台代码可以任意设置Cookie的过期时间
5.大小在4k以内
Session
1.将SessionID(随机数)通过Cookie发给客户端
2.客户端访问服务器时,服务器读取SessionID
3.服务器有一块内存(哈希表)保存了所有的session
4.通过SessionID我们可以得到对应用户的信息,如id、email
5.这块内存(哈希表)就是服务器上的所有session
LocalStorage
1.LocalStorage跟HTTP无关
2.HTTP不会带上LocalStorage的值
3.只有相同域名的页面才能互相读取LocalStorage(没同源那么严格)
4.每个域名LocalStorage最大储存量为5Mb左右(每个浏览器不一样)
5.常用场景:记录有没有提示过用户(不重要的信息)
6.LocalStorage永久有效,除非用户清理缓存
SessionStorage
1.SessionStorage跟HTTP无关
2.HTTP不会带上SessionStorage的值
3.只有相同域名的页面才能互相读取SessionStorage(没同源那么严格)
4.每个域名SessionStorage最大储存量为5Mb左右(每个浏览器不一样)
5.SessionStorage在用户关闭页面(会话结束)后就失效
请问cookie和session什么关系?
一般来说session是基于cookie实现的,因为session必须将sessionId放到cookie里,然后再发给客户端,没有sessionId就没session(反过来说cookie是session的基石)请问cookie和localStorage的区别是什么?
最大的区别的cookie每次请求的时候都会带到服务器上去,localStorage的时候不会带到服务器上去(因为跟http无关)。
cookie一般是4k,localStorage一般是5M请问localStorage和sessionStorage(会话存储)有什么区别?
前四点一样,但是sessionStorage在用户关闭页面(会话结束)后就失效了
如何处理HTTP缓存
1.cache-control
response.setHeader('Cache-Control','max-age=30')
通过设置Cache-Control
以后,30秒内,浏览器就不会再次请求了。(一般都是设置一年以上的Cache-Control
)
原理是Chrome在30s内请求同样的url,那么Chrome就会阻断这个请求,所以Chrome直接在它的内存里面返回上一次的main.js
,那个请求没有发请求。过了30s请求main.js
,浏览器会说这次给你个新的,再保存30s,重复上面的过程。
2.Expires
response.setHeader('Expires','Wed, 21 Oct 2015 07:28:00 GMT')
这个是到指定时间过期,而cache-control
是过了多久过期。Expires
有个缺点:它是使用的是本地时间,如果用户修改电脑的时间,那么Expires
就不起作用了,不推荐。所有还是使用cache-control
比较好。
如何更新缓存
更改URL
在入口处(HTML文件里面 )把URL
变一下,跟以前的URL
不一样,那么就不会使用缓存,浏览器就会到最新版。
比如在index.html
入口文件里的link
标签和script
标签的地址名字改掉,
改成
。
改成
。以后需要在变更代码只需要把
URL
修改即可。