JS Ajax請求如何防止重復提交
好長時間沒寫js代碼了剛好遇到這樣的問題。我們系統(tǒng)多數表單沒有做防止重復提交的。
由于不想在后端這邊處理,因為假如由后端處理的話,就需要在頁面加載的時候給出一次性的token值,加大了開發(fā)的工作量不說,還容易忘記做這個,同時,ajax也不好處理,需要提交失敗的話同時返回新的token值。
所以我想在,js這邊動手。其實以前和前端提過,久久不見動靜,就只好弄塊磚丟出去了。思路是,覆蓋掉$.ajax,在這里面處理掉防止重復提交的問題,而前端的業(yè)務開發(fā)不受影響,不改代碼,無感知。
我想架構的目的之一,就在于簡化業(yè)務開發(fā),屏蔽掉業(yè)務無關的細節(jié),讓一線開發(fā)安心寫業(yè)務吧。
代碼如下:
/** * Created by xiayongsheng on 2016/6/12. */ ;(function($){ var ajax = $.ajax; // 用于存儲ajax的請求 var ajaxState = {}; var kinhomAjax = function () { var args = Array.prototype.slice.call(arguments, 0); // url data 一致, // 應該將 url取出,data按鍵值排序,后將值拼接在一起,進行sha1得到的值作為指紋 // 累先用 url作為指紋吧 var hash = typeof args[0] === 'string'?args[0]:args[0].url; if (typeof ajaxState[hash] !== 'undefined') { if (ajaxState[hash] > 3) { alert('請不要重復提交,請求正在處理中'); } ++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請求如何防止重復提交的相關知識,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持!
相關文章
JavaScript自定義函數實現(xiàn)查找兩個字符串最長公共子串的方法
這篇文章主要介紹了JavaScript自定義函數實現(xiàn)查找兩個字符串最長公共子串的方法,涉及javascript針對字符串的遍歷、比較、查找等相關操作技巧,需要的朋友可以參考下2016-11-11childNodes.length與children.length的區(qū)別
childNodes.length與children.length的值常不一樣。2009-05-05