浅谈HTTP缓存

206 阅读1分钟

什么是http缓存

  • 第一次访问网页,浏览器会从服务器下载html,css,js,图片等相关文件;当下一次访问该网页时,部分文件(常见的有logo,头像等)直接从本地存储(内存或者硬盘)下载,这样大大节省了时间

执行机制

缓存保留时间设置

  • 服务器端设置:响应头>cahe-control,设置保存的时间 1637470141(1).png

缓存部分内容更新(webpack实例)

  • 文件名hash
    • 以下图为例,当index.js内容更新的时候,dist目录下对应的js文件就会以新的文件名的形式增加,每多一次修改,就新增文件。这样当用户再次访问,下载的是新的文件,旧缓存失效

1637471087(1).png

为什么网页的html文件一般不能缓存?

  • html文件涉及到了各种文件的引用
  • 如果html缓存,那么在一定时间内,网页内容的任何更新是无效的(html是网页变化更新的桥梁)