vue 强制清除浏览器缓存

vue 强制清除浏览器缓存(1)最基本的方法就是,在打包的时候给每个打包文件加上hash值,一般是在文件后面加上时间戳//在vue.config.js文件中,找到output:constTimestamp=newDate().getTime()output:{//输出重构打包编译后的文件名称【模块名称.版本号.时间戳】filename:`[name].${process.env.VUE_APP_Version}.${Timestamp}.js`,chunkFilen

大家好,又见面了,我是你们的朋友全栈君。

(1)最基本的方法就是,在打包的时候给每个打包文件加上hash 值,一般是在文件后面加上时间戳

//在vue.config.js 文件中,找到output:
const Timestamp = new Date().getTime()
output: { // 输出重构  打包编译后的 文件名称  【模块名称.版本号.时间戳】
      filename: `[name].${process.env.VUE_APP_Version}.${Timestamp}.js`,
      chunkFilename: `[name].${process.env.VUE_APP_Version}.${Timestamp}.js`
 
    }

(2)在html 文件中加入meta 标签(不推荐此方法)

<meta http-equiv="pragram" content="no-cache">
<meta http-equiv="cache-control" content="no-cache, no-store, must-revalidate">
<meta name="viewport" content="width=device-width,initial-scale=1.0">

(3)需要后端陪着,进行  nginx 配置 


location = /index.html {
    add_header Cache-Control "no-cache, no-store";
}
原因: 第二种方法浏览器也会出现缓存,配置之后禁止html 出现缓存
no-cache, no-store可以只设置一个
no-cache浏览器会缓存,但刷新页面或者重新打开时 会请求服务器,服务器可以响应304,如果文件有改动就会响应200
no-store浏览器不缓存,刷新页面需要重新下载页面

(4)在脚本加载时加入一个时间戳,修改 webpack.prod.conf.js 文件。(未使用过该方法,需要实践)

const version = new Date().getTime();
new HtmlWebpackPlugin({
    filename: config.build.index,
    template: 'index.html',
    inject: true,
    hash: version,
    favicon: resolve('icon.ico'),
    title: 'vue-admin-template',
    minify: {
        removeComments: true,
        collapseWhitespace: true,
        removeAttributeQuotes: true
    }
})

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/161108.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • phoenix 索引实践

    phoenix 索引实践

    2021年11月27日
    62
  • 发现 Google Buzz 与 Google Code 进行了集成[通俗易懂]

    发现 Google Buzz 与 Google Code 进行了集成[通俗易懂]提交B3logSolo(运行在GAE/J上的博客程序)代码后发现GoogleCode版本控制系统会将提交日志同步发布到GoogleBuzz中:但在Buzzconnectedsites里并没有看到与GoogleCode关联:现在一提交代码就Buzz,还是比较无奈的….本文是使用B3logSolo从简约设计の艺术进行同步发布的原文地址:…

    2022年10月16日
    0
  • 周鸿祎的真经「建议收藏」

    周鸿祎的真经「建议收藏」  什么样的产品易获风险投资商的青睐-周鸿祎的BLOG-搜狐博客 无论如何,产品还是企业最核心最根本的东西。产品决定了创业者选择一条什么样的发展道路。产品的定义和选择是创业的开始,而好的开始是成功的一半。 做一份投资计划书-周鸿祎的BLOG-搜狐博客 一份好的投资计划书,不仅有助于将创业者头脑中的创意、想法逻辑化

    2022年7月26日
    9
  • python分苹果问题_给大家分享一个「Python算法题」分苹果

    python分苹果问题_给大家分享一个「Python算法题」分苹果今天刷到一道算法题,分享一下果园里有堆苹果,N(1<N<9)只熊来分。第一只熊把这堆苹果平均分为N份,多了一个,它把多的一个扔了,拿走了一份。第二只熊把剩下的苹果又平均分成N份,又多了一个,它同样把多的一个扔了,拿走了一份,第三、第四直到第N只熊都是这么做的,问果园里原来最少有多少个苹果?可以先尝试一下再往下看(N=5的时候,答案是3121)。先简单分析一下这道题目,假设当第k个熊取完之后还有M个…

    2022年10月10日
    0
  • python matplotlib 画图保存图片简单例子[通俗易懂]

    python matplotlib 画图保存图片简单例子[通俗易懂]保存的时候遇到过保存空白图像的问题,是因为将plt.savefig(‘./test2.jpg’)放到了plt.show()之后,只要先保存在显示就可以正常保存了。importnumpyasnpimportmatplotlib.pyplotaspltt=np.arange(0,69,1)plt.plot(t,t,’r’,t,t**2,’b’)label=…

    2022年5月3日
    123
  • 常用meta整理

    常用meta整理

    2021年9月7日
    57

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号