HTTP缓存——Cache-Control & ETag

缓存和重用以前获取的资源的能力是优化性能很关键的一个方面

Cache-Control

在想要想要被缓存的文件上设置

response.setHeader('Cache-Control', 'max-age=30')

max-age的值表示多少秒之内浏览器不会再请求这个文件,而会在请求中读取。
一般情况下,如百度,设置为10年,即越长越好。如果要更新,则改变文件的url。
在node.js出现之前,要更新缓存,就会在要更新的文件名后加时间戳或版本号,但这样的不够细致,且乱。
node.js出现之后,用md5来管理(在文件名后加_md5)。webpack可帮忙处理这个事情。

注意,入口文件不能加缓存。聪明的浏览器也不接受入口文件的缓存(防止程序员犯低级错误。。)

ETag

在服务器里设置响应头

let string = fs.readFileSync('./main.js', 'utf8')
let fileMd5 = md5(string);
response.setHeader('ETag', fileMd5)

第二次请求的时候,浏览器会在请求头里设置if-None-Match,并附上这个md5值
那么,只需要比较这个md5值和你文件的md5值是否一样,如果一样,说明文件没有更新,不需要下载

if(request.header['if-None-Match'] === fileMd5){
  response.statusCode = 304;
}

Cache-Control 与 ETag 的区别

显然,设置ETag浏览器还是会发请求的,而缓存根本就不会发请求。

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值