2.和js完成后,是因为浏览器会对资源进行缓存

日期: 栏目:文章分享 浏览:757 评论:0

问题:很多时候在修改页面、css和js完成后,上传发现没有效果,这主要是因为浏览器会对一些资源进行缓存,在加载时还是使用的以前的资源,下面是归纳的几种方法。

1. 对于html缓存谷歌浏览器清除DNS缓存的方法,可以用mata标签,强制禁止浏览器缓存




2. 文件 Js Css文件缓存处理文件后面加参数(用版本号)url添加随机数、随机时间,Math.(),new Date().()。



URL ?ran=" + Math.random();
URL ?timestamp=+ new Date().getTime();

3. 使用ajax清除浏览器缓存。用ajax请求服务器最新文件,并加上请求头If--Since和Cache-,如下:

无法完成清除dns缓存_谷歌浏览器清除DNS缓存的方法_xp系统显示无法清除dns缓存

$.ajax({
     url:'www.haorooms.com',
     dataType:'json',
     data:{},
     beforeSend :function(xmlHttp){
        xmlHttp.setRequestHeader("If-Modified-Since","0");
        xmlHttp.setRequestHeader("Cache-Control","no-cache");
     },
     success:function(response){
         //操作
     }
     async:false
  });

直接用cache:false

谷歌浏览器清除DNS缓存的方法_无法完成清除dns缓存_xp系统显示无法清除dns缓存

$.ajax({
    url:'www.haorooms.com',
    dataType:'json',
    data:{},
    cache:false,
    ifModified :true ,
 
    success:function(response){
        //操作
    }
    async:false
 });

4. form表单清除缓存

xp系统显示无法清除dns缓存_谷歌浏览器清除DNS缓存的方法_无法完成清除dns缓存

5. 链接地址确认:

比如链接地址: 解决办法:页面重定向

//index.html

// => 这样始终请求的就是不一样的页面

总结:

这些方法都可以清除缓存,也不能保证百分百正确。因为我们只关注了客户端,却忽略了服务器端的设置, 如果服务器端nginx设置了Cache-,他是会覆盖掉我们页面中设置的的

Cache-的,所以有时候我们会发现明明css和js已经加了版本号,但是html文件里面引用的依然是旧的css和js文件谷歌浏览器清除DNS缓存的方法,因为服务器的缓存机制,旧的css和js并不会被立即删除,这种情况下, 我们需要和服务器端(或者运维)人员协商一个统一的缓存策略,以保证更新可以及时得到效果,如果沟通不顺利,或者想立刻看到效果,可以试试 如果服务器端没有去设置,我们设置的依然有效。

标签:

评论留言

我要留言

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。发布前请先查看评论规则:点我查看