页面更新JS与CSS的缓存生效问题

之前在更新线上页面时,新更新的css不生效,反复确认了线上更新情况,文件都没有错误,最后发现是样式的缓存问题。排除了浏览器的缓存,服务器也没有对页面进行缓存处理,具体缓存到了哪里尚不明确。

问了几个同事,又上网查询了一下原因,最后发现了解决办法:在css文件后加上?key=******,这样就会被识别成不同文件,重新加载,解决之前的缓存问题。

js也是同样的道理。

下面附上示例,version的值可以是时间,还可以做个记录,确定版本。

js:

<script type=”text/javascript” src=”{JS文件连接地址}?version=XXXXXXXX”></script>

css:

<link rel=”stylesheet” type=”text/css” href=”{CSS文件连接地址}?version=XXXXXXXX”>

时间: 2024-10-10 16:54:20

页面更新JS与CSS的缓存生效问题的相关文章

页面防止js,css等缓存问题解决办法

这个问题对于做开发的人来说不是多大问题,也不太容易发现,因为在做开发的时候一般都会把缓存禁用,而且就算有缓存也立马被清掉了,所以缓存问题很容易解决,却也很容易被忽视,这不项目上线的时候遇到了这个问题,虽说不是很严重,却也很影响体验,客户才不会去清理客户端缓存什么的,所以只能在服务器端解决了: 解决办法也比较简答,就是在引入css,js文件的时候在文件名后面添加一个版本号,如:css?v=1;v后面的数字可以自己定, 只要这里面文件修改后,v改变了就行了: 建议在开发的时候定义一个全局变量,这样只

【easyui】关于tabs的选项卡的href 引入页面后 js、css失效

示例: $("tabs").tabs("add",{ href:"test.html" }) test.html 只有body里的内容会被执行  如果js或css在body外则会失效 解决办法: 1.如果是内部js.css   将它们放到body内即可 2.如果是外部js.css   将他们在主页面引用即可 3.写一个servlet,在servlet里response.sendRedirect("test.html") [附]

根据正则表达式匹配页面中js和css文件

// 匹配 List<string> srcList = new List<string>(); List<string> linkList = new List<string>(); // 匹配js文件 string pattern = "<script[^>]*?src=\"([^>]*?)\"[^>]*?>"; MatchCollection mcs = Regex.Matches(

java Web程序使用wro4j合并、压缩js、css等静态资源

在Web项目中,js.css合并压缩,不仅有利于减少Http请求数量.减少宽带资源占用,还能有效的管理各种js.css的引入,使整个项目更加有序.而对于访问用户来说,其更大的好处是增加了页面的打开速度,大大提升了用户体验. 所以,互联网各类网站,会通过各种手段,对静态文件进行合并.压缩,动静分离,使用CDN加速等.以此达到网站访问速度的优化.everycoding.com官网使用的是Java语言开发.因此使用了Java 方面的第三方Jar:wro4j来压缩Js.CSS.本文主要介绍Java We

将css和js缓存到localStorage缓存,提高网页响应速度

1 /** 2 * Created by SevenNight on 2016/9/21 0021. 3 * 插件功能:使用localStorage缓存js和css文件,减少http请求和页面渲染时间 4 * 使用方法: 5 * 1.使用此插件前,需要给插件的pageVersion变量赋值,建议变量值由服务器后端输出,当需要更新客户端资源时,修改版本值即可. 6 * 2.加载Js:由于js加载有顺序要求,所以需要将后加载的脚本作为前一个脚本的回调参数传入,如: 7 * whir.res.load

Web移动端使用localStorage缓存Js和CSS文件

将js css文件缓存到localstorage区可以减少页面在加载时与HTTP请求的交互次数,从而优化页面的加载时间. 电脑端使用localstorage是测试没有问题的,但是用android的apk打包之后,导致localstorage失效,无法进行缓存,查阅资料之后,得知解决方法: 安卓代码: mWebView.getSettings().setDomStorageEnabled(true); mWebView.getSettings().setAppCacheMaxSize(1024*1

在js或css后加?v= 版本号不让浏览器缓存

在js或css后加?v= 版本号不让浏览器缓存,jscss 客户端会缓存css或js文件,改变版本号,客户端浏览器就会重新下载新的js或css文件,在js或css后加?v= 版本号的用法如下 代码如下: <span style="font-size:14px;">css和js带参数(形如.css?v=与.js?v= 或 .css?version=与.js?version= ) <script type=”text/javascript” src=”jb51.js?ve

Nginx设置Js、Css等静态文件的缓存过期时间

location ~.*\.(js|css|html|png|jpg)$ { expires 3d; } expires    3d; //表示缓存3天 expires    3h; //表示缓存3小时 expires    max; //表示缓存10年 expires    -1; //表示永远过期. 如果设置为-1在js.css等静态文件在没有修改的情况下返回的是http 304,如果修改返回http 200 http 304:自从上次请求后,请求的网页未修改过.服务器返回此响应时,不会返回

JS以及CSS对页面的阻塞

一.JS阻塞 所有的浏览器在下载JS文件的时候,会阻塞页面上的其他活动,包括其他资源的下载以及页面内容的呈现等等,只有当JS下载.解析.执行完,才会进行后面的 操作.在现代的浏览器中CSS资源和图片image资源是并行下载的,在IE6中默认的并行的加载数目是2个,在IE6以后以及其他的浏览器中的默认的并行加载数目是6个. 在浏览器从服务器接收到HTML文档后,并把HTML在内存中转换为DOM树,在转换节点的过程中如果引入了CSS文件以及添加了images,则会在文档加载的同时并行的加载CSS文件