纯 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
})