vue增加强缓存和版本号

栏目: JavaScript · 发布时间: 6年前

内容简介:强缓存:到底什么是强缓存?强在哪?其实强是强制的意思。当浏览器去请求某个文件的时候,服务端就在respone header里面对改文件做了缓存配置。缓存的时间、缓存类型都由服务端控制。

强缓存:

到底什么是强缓存?强在哪?其实强是强制的意思。当浏览器去请求某个文件的时候,服务端就在respone header里面对改文件做了缓存配置。缓存的时间、缓存类型都由服务端控制。

vue增加强缓存和版本号

强缓存实现:

cache-control: max-age=315360000, public ,immutable

客户端和代理服务器都可以缓存该资源,在315360000秒(10年)的有效期内,如果有请求该资源的需求的话就直接读取缓存,statu code:200 ,即使用户做了刷新操作,也不向服务器发起http请求

参考文章"彻底弄懂强缓存与协商缓存"

index.html文件采用协商缓存,理由就是要用户每次请求index.html不拿浏览器缓存,直接请求服务器,这样就保证资源更新了,切记不要设置强缓存!!!

其他资源采用强缓存 + 协商缓存,理由就不多说了。

nginx配置

vue增加强缓存和版本号

版本号管理在 .env.local 文件下

VUE_APP_VERSION = v0.01

通过webpack打包设置,name+版本号+时间戳.js

可以根据服务器设置强缓存,缓存静态文件

configureWebpack: {
        output: { // 输出重构  打包编译后的 文件名称  【模块名称.版本号.时间戳】
            filename: `[name].${process.env.VUE_APP_VERSION}.${Timestamp}.js`,
            chunkFilename: `[name].${process.env.VUE_APP_VERSION}.${Timestamp}.js`,
          },
}

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

小群效应

小群效应

徐志斌 / 中信出版集团 / 2017-11 / 58.00元

互联网经济时代,新零售、网红经济、知识经济多受益于社群。用户的获取、留存及订单转化直接决定了一个社群的存亡。无论是“做”群还是“用”群,每个人都需要迭代常识:了解用户行为习惯,了解社群运行规律。 《社交红利》《即时引爆》作者徐志斌历时两年,挖掘腾讯、百度、豆瓣的一手后台数据,从上百个产品中深度解读社群行为,通过大量生动案例总结出利用社交网络和海量用户进行沟通的方法论。 本书将告诉你: ......一起来看看 《小群效应》 这本书的介绍吧!

HTML 压缩/解压工具
HTML 压缩/解压工具

在线压缩/解压 HTML 代码

CSS 压缩/解压工具
CSS 压缩/解压工具

在线压缩/解压 CSS 代码

MD5 加密
MD5 加密

MD5 加密工具