清理浏览器网站缓存的几种方法（meta,form表单，ajax）

Posted 2020-09-05

1.meta方法

  HTML header中加入

  <meta http-equiv="pragma" content="no-cache">

  说明：禁止浏览器从本地计算机的缓存中访问页面内容。上述设定，访问者将无法脱机浏览。

  <meta http-equiv="Cache-Control" content="no-cache,must-revalidate">

  说明：Cache-Control指定请求和响应遵循的缓存机制，no-cache指示请求或响应消息不能缓存，must-revalidate，对于客户机的每次请求，代理服务器必须想服务器验证缓存是           否过时；

  <meta http-equiv="expires" content="0">

  说明：可以用于设定网页的到期时间。一旦网页过期，必须到服务器上重新传输。

  合起来用，就可以使你再次进入曾经访问过的页面时，浏览器必须从服务端下载最新的内容，达到刷新的效果。

 

2.清理form表单的临时缓存

  document.getElementById("YourFormID").reset();

  说明：js重置表单（reset）的方法。

  在form中加入autocomplete=‘off‘属性，或者在input中加入autocomplete=‘off‘属性

  说明：关闭自动填充。

 

3.jquery--ajax清除缓存

  A.用ajax请求服务器最新文件，并加上请求头If-Modified-Since和Cache-Control,如下:

  $.ajax({
     url:‘‘,
     dataType:‘json‘,
     beforeSend :function(xmlHttp){ 
        xmlHttp.setRequestHeader("If-Modified-Since","0"); 
        xmlHttp.setRequestHeader("Cache-Control","no-cache");
     },
     success:function(response){
     }
  });

  B.直接用cache:false

  $.ajax({
     url:‘,
     dataType:‘json‘,
     cache:false, 
     success:function(response){
     }
  });

  C.用随机数或者随机时间避免缓存

  $.ajax({
　　　//随机数
     url:‘YourURL?ran=‘+Math.random(),
     dataType:‘json‘,
     success:function(response){
     }
  });

  $.ajax({
　　 //随机时间
     url:‘YourURL?timestamp=‘+ new Date().getTime(),
     dataType:‘json‘,
     success:function(response){
     }
  });