浏览器缓存

[wangning0]

参考资料

强缓存和协商缓存

强缓存： 浏览器在加载资源时，先根据这个资源的一些http header判断它是否命中强缓存，强缓存如果命中了，浏览器直接从它自己的缓存中读取资源，不会发送请求到服务器上。假设有某个css文件，浏览器在加载它所在的页面中时，如果css文件的缓存配置命中了强缓存，那么浏览器就直接从缓存中加载这个css文件，连请求都不会发送到网页所在服务器

协商缓存：当强缓存没有命中的时候，浏览器一定会发送一个请求到服务器，通过服务器端一句资源的一些http header验证这个资源是否命中协商缓存，如果命中，则会返回这个请求，但是不会携带数据，而是会告诉客户端去缓存中加载这个资源

**强缓存和协商缓存的共同点：**如果命中了，都是从客户端缓存中加载资源，而不是从服务器中加载资源数据，强缓存不发请求到服务器，二协商缓存会发请求到服务器

当协商缓存没有命中时，浏览器直接从服务器加载资源数据

强缓存的原理

强缓存是利用Expires或者Cache-Control这两个http response header 实现的，都用来表示资源在客户端缓存的有效期，前者是利用绝对时间，后者是用相对时间来表示

expires 是一个具体的时间，Cache-Control里面的max-age为相对的秒数

expires因为设置的是绝对时间，所以需要保证服务器时间与客户端时间相差不大，如果相差较大，那么缓存管理容易出现问题

协商缓存的原理

当浏览器某个资源的请求没有命中强缓存，就会发一个请求到服务器，验证协商缓存是否命中，如果协商缓存命中，请求响应返回的http状态为304并会显示一个Not Modified的字符串

协商缓存利用的原理是Last-Modified与If-Modified-Since和ETag、If-None-Match两队Header来管理

前者是通过修改时间来进行判断，后者是通过文件资源的内容来进行判断

强缓存的管理

通常有2种方式来设置是否启用强缓存

• 通过代码的方式，在web服务器返回的响应中添加Expires和cache-control header
• 通过配置web服务器的方式，让web服务器在响应资源的时间统一添加Expires和Cache-Control Header

缓存的应用

HTML5的应用缓存 或者称为appcache

要想在这个缓存中保存数据，可以使用一个描述文件(mainifest file),列出要下载和缓存的资源

Cookie

浏览器中对于cookie的长度是有限制的，一般为4KB左右

cookie的组成：

• 名称
• 值
• 域
• 路径
• 有效时间
• 安全性 指定后，cookie只有在使用SSL连接的时候才发送到服务器。