强缓存和协商缓存

303 阅读3分钟

为什么使用缓存 ?

当我们访问服务器时,如果服务器每次都需要响应资源,那么对服务器的压力是很大的,同样的,浏览器如果每次都去加载服务器响应的资源,效率也会变得非常慢。不管对于浏览器还是客户端,缓存都是很重要的。

浏览器缓存的优点

1.减少不必要的数据传输

2.减少服务器的负担,提升网站性能

3.加快浏览器加载速度 提升用户体验

强缓存

当浏览器请求一个服务器数据时,服务器可以在响应头中添加cache-control(http1.1) 或 expires(http1.0) 字段 用于配置强缓存 浏览器会根据配置将请求到的资源缓存到本地硬盘 设置强缓存之后 在客户端再次请求该资源时会自动访问本地缓存 并且返回200状态码 不过 一般情况下

max-age=3000 缓存有效时间3000秒

public 可以被浏览器和代理服务器缓存

private 只能被浏览器缓存

immutable 刷新浏览器时阻止向服务器发起http请求

no-cache 不设置强缓存(一般强缓存失效时会使用协商缓存)

no-store 不设置任何缓存 强缓存和协商缓存

协商缓存

强缓存和协商缓存都是 服务器的缓存策略 当浏览器发送第一次请求时 客户端会响应资源和一个资源标识 并将资源存在本地缓存 当浏览器再次访问服务器时 会将这个资源标识携带 客户端会对比这个标识 如果标识相同 说明资源没有更新 返回304状态码 浏览器接收到304状态码之后会直接访问缓存 如果标识不相同 则返回200状态码并将最新的资源和资源标识响应该浏览器

资源标识类型

Last-Modified

记录服务器资源最新的更新时间

响应头字段 Last-Modified

请求头字段 If-Modified-Since

ETag

记录服务器资源的唯一字符串

响应头字段 ETag

请求头字段 If-None-Match

Last-Modified和ETag的区别

Last-Modified 记录以秒为单位的时间标记 但对于高密度的资源更新 会导致精确度不是那么高 对于程序的需求资源有时需要周期性的更新(只改变更新时间,不改变资源内容) 这个时候客户端请求资源也会造成没有必要的资源浪费 ETag 相对于last-Modified ETag的效率会稍微低一点 因为每一次生成资源标识都需要计算一个hash值 而Last-Modified只需要拿到当前系统的时间即可

Nodejs设置协商强缓存与协商缓存

res.setHeader('max-age': '3600 public') //强缓存
res.setHeader(etag: '5c20abbd-e2e8') //协商缓存etag
res.setHeader('last-modified': Mon, 24 Dec 2018 09:49:49 GMT) //协商缓存last-modefied