一般项目发版后前端静态文件会有缓存问题,
不强制刷新很难解决,
但是用户不会去强制刷新,
这就需要我们开发人员在配置方面解决浏览器缓存静态文件问题。
一般浏览器缓存的文件有html、css、js等。
css、js文件被缓存的解决方案
一般html中引入的css和js的名字都加了哈希值,所以新版本css、js和就旧版本的名字是不同的,不会有缓存问题。
如果index.html文件被缓存就稍微麻烦些
首先可以在index.html文件头部添加mate标签禁止缓存
<meta http-equiv="Expires" content="0">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-control" content="no-cache">
<meta http-equiv="Cache" content="no-cache">
浏览器的缓存解决,
但是一般在服务器端还是会有缓存,
当浏览器访问index.html时拿到的就是服务器缓存的文件,所有我们还需要解决服务器的缓存
这需要在服务器配置不让缓存index.html
nginx 配置如下:
location = /index.html {
add_header Cache-Control "no-cache, no-store"
}
当浏览不同Url时,浏览器会自动将当前访问的地址进行一次缓存;而第二次访问时着调用缓存下来的页面,从而达到页面快速加载(页面加载优化)的目的;因此,我们可以给页面后面设定个不同的值,让页面保持没错访问的不同即可达到不缓存的目的了!
下面是个简单的示例:
复制代码 代码如下:
<script>
document.write("<script type='text/javascript' src='/js/test.js?"+Math.random()+"'></script>")
</script>
其他的类似,只需在地址后加上+Math.random()
注意:因为Math.random() 只能在Javascript 下起作用,故只能通过Javascript的调用才可以
最后加一个ajax也不让缓存的方法
复制代码 代码如下:
xmlHttp.open("GET", "ajax.asp?now=" + new Date().getTime(), true)
记得后面的now=" + new Date().getTime()是重点,需要带参数的。
希望本文所述对大家的javascript程序设计有所帮助。
以上是云栖社区小编为您精心准备的的内容,在云栖社区的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索js , html , 页面 不缓存 javascript 缓存、javascript 清除缓存、javascript缓存数据、javascript 本地缓存、javascript 缓存机制,以便于您获取更多的相关知识。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)