由于不想在后端這邊處理，因?yàn)榧偃缬珊蠖颂幚淼脑?huà)，就需要在頁(yè)面加載的時(shí)候給出一次性的token值，加大了開(kāi)發(fā)的工作量不說(shuō)，還容易忘記做這個(gè)，同時(shí)，ajax也不好處理，需要提交失敗的話(huà)同時(shí)返回新的token值。

所以我想在，js這邊動(dòng)手。其實(shí)以前和前端提過(guò)，久久不見(jiàn)動(dòng)靜，就只好弄塊磚丟出去了。思路是，覆蓋掉$.ajax,在這里面處理掉防止重復(fù)提交的問(wèn)題，而前端的業(yè)務(wù)開(kāi)發(fā)不受影響，不改代碼，無(wú)感知。

我想架構(gòu)的目的之一，就在于簡(jiǎn)化業(yè)務(wù)開(kāi)發(fā)，屏蔽掉業(yè)務(wù)無(wú)關(guān)的細(xì)節(jié)，讓一線(xiàn)開(kāi)發(fā)安心寫(xiě)業(yè)務(wù)吧。

代碼如下:

/**
* Created by xiayongsheng on 2016/6/12.
*/
;(function($){
var ajax = $.ajax;
// 用于存儲(chǔ)ajax的請(qǐng)求
var ajaxState = {};
var kinhomAjax = function () {
var args = Array.prototype.slice.call(arguments, 0);
// url data 一致，
// 應(yīng)該將 url取出，data按鍵值排序，后將值拼接在一起，進(jìn)行sha1得到的值作為指紋
// 累先用 url作為指紋吧
var hash = typeof args[0] === 'string'?args[0]:args[0].url;
if (typeof ajaxState[hash] !== 'undefined') {
if (ajaxState[hash] > 3) {
alert('請(qǐng)不要重復(fù)提交，請(qǐng)求正在處理中');
}
++ajaxState[hash];
return $.Deferred();
}
ajaxState[hash] = 1;
var def = ajax.apply($,args);
def.done(function () {
delete ajaxState[hash];
});
return def;
};
$.ajax = kinhomAjax;
})(jQuery);

以上所述是小編給大家介紹的JS Ajax請(qǐng)求如何防止重復(fù)提交的相關(guān)知識(shí)，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

您可能感興趣的文章: