上线项目更新版本后如何避免客户端js和css缓存

最新推荐文章于 2024-07-09 10:19:24 发布
最新推荐文章于 2024-07-09 10:19:24 发布
阅读量5.1k 收藏 4
点赞数 1
分类专栏： 前端 文章标签： css 缓存 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zhuocr/article/details/70568850
版权

在引入的页面中

<link rel="stylesheet" type="text/css" href="__MOBILE__/css/detail-page.css？version=1"/>
<script src="__MOBILE__/js/jquery.min.js?version=1"></script>

不用改原始的css和js文件名，只需在引入页面加上一个参数，一般为js、css版本号。

如果项目更新了css或者js文件，可以在文件中统一替换版本号，这样客户端会重新加载css和js文件，避免了缓存。

zhuocr
关注
专栏目录
前端发版后后及时拉取最新版本代码， 解决浏览器缓存问题
iOS逆向与安全
08-22 84
vue 默认配置，打包后 css 和 js 的名字后面都加了哈希值，不会有缓存问题，但是 index.html 在服务器端可能是有缓存的，需要在服务器配置不让缓存 index.html。proxy_set_header是nginx设置请求头给上游服务器，add_header是nginx设置响应头信息给浏览器。问题： 当修改了JS文件的内容并发布到线上时，用户的浏览器可能会因为缓存了旧的JS文件而不会立即加载新的代码。更新生产环境站点资源时，需要错开高峰期 ，涉及前端文件更新的，记得做站点缓存验证。
php 防止css js被盗用,怎么防止别人下载网页CSS
weixin_30509193的博客
04-14 877
防止别人下载网页CSS的方法：1、禁止页面另存；2、将CSS元素中的图片通过“../../images/”来存储；3、将css中的图片元素做防盗链；4、加密css地址防止别人下载CSS文件即可。本教程操作环境：windows7系统、css3版，该方法适用于所有品牌电脑。防止别人下载网页CSS：1、禁止页面另存，最简单粗暴！2、CSS元素中的图片通过../../images/来存储，可以有效避免另存...
关于js/css修改文件后浏览器缓存不更新的探讨
ITsmallchen的博客
07-22 670
使用场景： 每次修改了js/css文件，重新发版后，用户访问时，浏览器总是会缓存了发版前的样式，想要获取最新的样式，需要Ctr+F5清除缓存并刷新，用户体验不好。所以，我们希望每次发版，用户正常访问就能获取最新的样式，以下是我从各处搜罗的几种方式： 方式一、使用messages.properties文件 1、目录结构：注意文件名不要写错了，默认放的位置在resources下 2、messages.properties内容: 定义版本号 js.version=3.0.1 3、修改js/css引用 js/c
前端发布项目后，解决缓存的老版本文件问题
最新发布
weixin_45403802的博客
07-09 1036
4、发起ajax请求，请求version.json文件获取version时间戳，和本地保存的上一次的时间戳做比较，如果不一样，则进行对应的操作。3、在每次执行webpack构建命令，都会在dist目录下生成一个version.json文件，里面有一个字段叫version，值是构建时的时间戳，每次构建都会生成一个新的时间戳。每次打包发版时都使用webpack构建一个version.json文件，文件里的内容是一个随机的字符串（我用的是时间戳），每次打包都会自动更新这个文件。
部署项目避免本地js、css缓存
hgg923的专栏
08-29 965
给css和js添加版本号，名称任取（?v=20170825）： link href="${ctx}/static/css/active.css?v=20170825" rel="stylesheet" type="text/css"> script type="text/javascript" src="${ctx}/static/js/common.js?v=20170829">scri
怎么避免浏览器缓存静态文件(转)
ymfhcn
12-14 597
对于动态文件,比如 index.asp?id=...  或者 index.aspx?id=... 相信有经验的程序员都知道怎样禁止浏览器缓存数据了. 但是对于静态文件(css,jpg,gif等等), 在什么场合下面我们需要禁止浏览器缓存他们,怎么做? 本文讨论的主题是如何防缓存, 尤其是如何防止静态文件被缓存.. 在  RE:对博客园URL的一些调整建议, 二级域名不利于客户端浏览器缓存 一...
解决修改css或js文件，浏览器缓存更新问题。
asdfgh0077的博客
07-20 216
解决修改css或js文件，浏览器缓存更新问题。
Vue 项目更新，浏览器不需强制刷新就可更新版本！ 防止缓存
AsBefore麦小兜
07-01 3429
禁止index 页面的缓存
web项目页面缓存清除，不用每次刷新浏览器
03-02
在Web开发中，页面缓存是一个重要的概念，它涉及到用户浏览网页时的性能优化和更新体验。当浏览器加载一个网页后，为了加快后续访问速度，会将页面的静态资源（如HTML、CSS、JavaScript文件、图片等）存储在本地缓存...
PHP小技巧之JS和CSS优化工具Minify的使用方法
10-25
合并和压缩JavaScript（JS）及层叠样式表（CSS）文件是实现这一优化的有效策略。本文将介绍如何使用PHP实现多个JS和CSS文件的合并与压缩，以及如何使用名为Minify的开源工具来达到相同的目的。 ### PHP实现合并和...
Javascript离线应用与客户端缓存
qq_41564928的博客
08-01 182
离线应用与客户端存储 1.离线检测 navigator对象 navigator.onLine 属性表示当前设备是否在线，在线则返回 true，离线则返回 false 离线检测事件 online ：当浏览器从离线变为上线时触发 offline：当浏览器从上线变为离线时触发 2.应用缓存 manifest file appcache是从浏览器缓存中抽取一部分缓存用来下载想要...
html如何清理缓存图片,H5案例分享：js、css和图片等静态文件更新时如何避免浏览器缓存...
weixin_42410477的博客
06-30 1163
在做web项目的中，我们不可避免的会引入一些css、js和图片等文件，但是更新文件后，却经常出现因浏览器缓存问题，导致即使更改了代码或者图片，但是在浏览器上访问的时候却没有发生变化，这是因为现在大多数浏览器都会缓存网站上的图片、CSS 和 JS 文件，以提高加载速度。当你的页面修改 CSS 和 JS 的时候往往因为缓存的原因无法立刻生效，那我们怎么避免这样的情况发生呢？方法一：手动清理浏览器的缓存...
html强制不缓存js和css,无视WordPress缓存强制加载最新CSS和JS
weixin_28692867的博客
06-09 695
无论你是折腾企业英文网站，还是个人博客，可能都免不了折腾一番 WordPress。由于各种需要，你可能会安装各类缓存插件，如 WP Super Cache，W3 Total Cache，DB Cache Reloaded Fix，Hyper Cache。当你安装主题之后，可能免不了一番修改，频繁更新主题的 CSS、JS文件。但这些静态文件已被缓存插件缓存，有时候你修改上传覆盖之后，前台页面也无法立...
给引入页面的js和css资源加上版本号，防止浏览器缓存资源
乔的博客
06-13 790
【代码】给引入页面的js和css资源加上版本号，防止浏览器缓存资源。
如何避免CSS和js文件修改时客户端缓存
yyj_ZS的博客
12-29 976
什么是客户端缓存？  身为开发者，我们开发的时候都习惯直接禁用浏览器缓存，或者修改完打开项目的时候顺手清理缓存，但是在用户使用项目的时候，他们往往不会考虑缓存的问题。所以我们开发者在进行版本更新的时候，就可能出现，用户的客户端缓存了样式，而自己提交的新版本样式没有被渲染出来的问题。 解决缓存的方法： 1. 在引入css文件,js文件的时候，在末尾加上一个参数，这个参数相当于版本号，在项目更新的时候修改，这样客户端在引入文件的时候就会重新加载渲染这个文件。如果你开发的是VUE项目，那么可以在构建项目的时候使用
解决修改css或js文件后，浏览器缓存未更新问题
songhuangong123的博客
12-13 565
用户按Ctrl + F5强制刷新页面
前端项目上线后，浏览器缓存未刷新问题
weixin_42936434的博客
03-07 6096
http的缓存机制是一种优化策略。但也会出现文件变动后浏览器没有更新的问题。综上，入口文件不缓存或采用协商缓存，其他静态资源使用强缓存，url拼接hash值或者打包时给文件名加上hash值。
Vue项目线上发布，都有缓存不生效怎么办？
qq_34701838的博客
05-25 6685
前言： 每次把修改后的vue项目build构建的打包文件丢到线上服务器后，发现还是上一次的效果，新修改的不起效，每次都需要ctrl+F5强制刷新页面，用户太多不可能让所有人每次都这样去折腾，为啥？ vue cli不是给静态资源css、js、img自动加了哈希么，怎么还会有缓存？ 经过多方调试，发现是因为入口文件index.html需要在服务器端设置禁止缓存。 解决缓存问题可以分两步走： ①nginx配置index不缓存 ②代码加入版本更新检测强制刷新 解决方案一：（Linux服务器设置
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值