http强缓存-

浏览器在命中强缓存的时候是不会发送请求至服务器的,上文也说到过,强缓存是根据资源请求的http头部信息来判断的,主要是根据哪些信息来判断的呢?其实呢强缓存主要是根据请求header头中的Expires或者是Cache-Control两个字段来控制的,这两个字段都是在http response header实现的,表示资源在浏览器缓存的有效期,Expires是http1.0提出的,而Cache-Control是http1.1提出的,如果二者同时存在,则优先以Cache-Control为准。
在这里插入图片描述

Expires
Expires是缓存过期时间,用来指定资源到期时间,是从服务器端返回的一个具体时间点,在http请求时告诉浏览器在过期时间前浏览器都可以直接从缓存中加载资源数据,而无需再次请求。如上图中所示,服务器返回expires: Sat, 11 Sep 2021 06:48:30 GMT,这个时间就代表资源失效的时间,也就是说在2021-09-11 14:48:30
之前都是有效的。但是这种方式有个明显的bug,那就是服务器返回的是一个绝对时间,所以当客户端本地的时间被修改后,就能影响缓存命中的结果,于是就衍生出Cache-Control这个字段,这也是为啥Expires和Cache-Control同时存在的时候,会以后者为准,下面介绍下Cache-Control:
Cache-Control
Cache-Control是一个相对时间,相对于Expires,Cache-Control就不会出现上述修改客户端时间导致影响缓存命中结果的问题。
Cache-Control可以由多个字段组合而成,主要又以下几个值:

max-age:max-age的值是一个时间长度,单位是s,在这个时间段内缓存是有效的,在下图中max-age=31536000,也就是说缓存有效期为31536000s,在没有禁用缓存并且没有超过这个有效时间的情况下,再次访问这个资源就会命中缓存。
在这里插入图片描述

public:Cache-Control: public表示响应内容可以被任何对象(客户端、代理服务器…)缓存。
private:Cache-Control: private代表只有发起请求的浏览器才可以进行缓存。
s-maxage:同max-age,但只会在代理服务器中生效。
no-cache:并不是字面意思上的‘不缓存’,而是使用对比缓存验证,强制向服务器验证,言外之意就是每次发送请求前,都会向服务器进行验证,如果服务器允许,才能使用本地缓存。
no-store:这个是真正意义上的禁止缓存,每次请求都要向服务器重新获取数据。

cache-control指令如何使用?
在这里插入图片描述

通过Cache-Control以及max-age设置,可以达到长缓存的效果,下面用node来看下Cache-Control是如何被设置的。
// server.js
const http = require(‘http’)
const fs = require(‘fs’)

http.createServer(function (request, response) {
console.log(‘request come’, request.url)

if (request.url === ‘/’) {
const html = fs.readFileSync(‘test.html’, ‘utf8’)
response.writeHead(200, {
‘Content-Type’: ‘text/html’
})
response.end(html)
}

if (request.url === ‘/script.js’) {
response.writeHead(200, {
‘Content-Type’: ‘text/javascript’,
‘Cache-Control’: ‘max-age=200’ // 浏览器缓存时间
})
response.end(‘console.log(“script loaded twice”)’)
}
}).listen(8888)

console.log(‘server listening on 8888’)

如果客户端向服务器发了请求,那么是否意味着一定要读取回该资源的整个实体内容呢?

试想客户端上某个资源保存的缓存过期时间过期了,但这个时候服务器并没有更新过这个资源,如果这个资源很大,客户端要求服务器再把这个东西重新发一遍过来,此时服务器内心是拒绝的,因为资源并没有改变,再次发送会非常浪费带宽和时间,属于可以发送但没必要,那是否有办法让服务器知道客户端现有的缓存文件是有效的,然后直接告诉客户端:“这东西你直接用缓存里的就可以了,我这边没更新过呢,就不再传一次过去了”。为了让客户端与服务器之间能实现缓存文件是否更新的验证、提升缓存的复用率,http新增了几个字段来做这件事情,下面来说一下。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值