纯 js 让浏览器不缓存 ajax 请求

开发「bufpay.com 我的即时到帐收款平台」支付页面须要用到 ajax 轮询订单的支付状态。

如今浏览器对 ajax 的缓存策略遵循 http response header 里面的缓存设置，为了保证每次轮询须要获取最新的订单信息，咱们须要对 ajax 请求作一些修改。

若是你使用 jquery 能够直接在 document ready 的时候用

 $.ajaxSetup({ cache: false });

 

来让每一个 ajax 请求都在后面添加时间戳。

bufpay.com 的支付页面为了最快的加载速度，就没有使用任何第三方库（jquery 库压缩后都有大概100K），因此这里就手动在每一个 ajax 请求里面添加时间戳，代码以下：

 

//纯 js 实现 ajax 请求            
var ajax = function(url, method, callback, params = null) {
                 var obj;
                 try {
                  obj = new XMLHttpRequest();
                 } catch(e){
                   try {
                     obj = new ActiveXObject("Msxml2.XMLHTTP");
                   } catch(e) {
                     try {
                       obj = new ActiveXObject("Microsoft.XMLHTTP");
                     } catch(e) {
                       alert("Your browser does not support Ajax.");
                       return false;
                     };
                   };
                 };
                 obj.onreadystatechange = function() {
                  if(obj.readyState == 4) {
                     callback(obj);
                  };
                 };
                 obj.open(method, url, true);
                 obj.send(params);
                 return obj;
             };

//请求的时候
var obj = ajax("{{domain}}/api/query/{{aoid}}?_=" + new Date().getTime(), "GET",  function(obj) {
    // do something
})

 

这样，就能够啦。

 

插播广告 ✧(≖ ◡ ≖✿)嘿嘿