js ajax請(qǐng)求防止重復(fù)提交

Dionysus_go 發(fā)布于2019-08-21 10:53 / 2254人閱讀

摘要：我們系統(tǒng)多數(shù)表單沒有做防止重復(fù)提交的。思路是，覆蓋掉在這里面處理掉防止重復(fù)提交的問題，而前端的業(yè)務(wù)開發(fā)不受影響，不改代碼，無感知。

好長時(shí)間沒寫js代碼了剛好遇到這樣的問題。我們系統(tǒng)多數(shù)表單沒有做防止重復(fù)提交的。

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

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

我想架構(gòu)的目的之一，就在于簡化業(yè)務(wù)開發(fā)，屏蔽掉業(yè)務(wù)無關(guān)的細(xì)節(jié)，讓一線開發(fā)安心寫業(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);

GPU云服務(wù)器云服務(wù)器防止重復(fù)提交重復(fù)提交請(qǐng)求防止form重復(fù)提交 asp防止重復(fù)提交

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/86353.html

相關(guān)文章

Web項(xiàng)目如何防止客戶端重復(fù)發(fā)送請(qǐng)求

摘要：在項(xiàng)目中，有一些請(qǐng)求或操作會(huì)對(duì)數(shù)據(jù)產(chǎn)生影響比如新增刪除更新，針對(duì)這類請(qǐng)求一般都需要做一些保護(hù)，以防止用戶有意或無意的重復(fù)發(fā)起這樣的請(qǐng)求導(dǎo)致的數(shù)據(jù)錯(cuò)亂。本文總結(jié)了一些防止客戶端重復(fù)發(fā)送請(qǐng)求的方法。在Web項(xiàng)目中，有一些請(qǐng)求或操作會(huì)對(duì)數(shù)據(jù)產(chǎn)生影響（比如新增、刪除、更新），針對(duì)這類請(qǐng)求一般都需要做一些保護(hù)，以防止用戶有意或無意的重復(fù)發(fā)起這樣的請(qǐng)求導(dǎo)致的數(shù)據(jù)錯(cuò)亂。本文總結(jié)了一些防止客戶端重...

fireflow 2019-08-21 11:42 評(píng)論0 收藏0
Web項(xiàng)目如何防止客戶端重復(fù)發(fā)送請(qǐng)求

摘要：在項(xiàng)目中，有一些請(qǐng)求或操作會(huì)對(duì)數(shù)據(jù)產(chǎn)生影響比如新增刪除更新，針對(duì)這類請(qǐng)求一般都需要做一些保護(hù)，以防止用戶有意或無意的重復(fù)發(fā)起這樣的請(qǐng)求導(dǎo)致的數(shù)據(jù)錯(cuò)亂。本文總結(jié)了一些防止客戶端重復(fù)發(fā)送請(qǐng)求的方法。在Web項(xiàng)目中，有一些請(qǐng)求或操作會(huì)對(duì)數(shù)據(jù)產(chǎn)生影響（比如新增、刪除、更新），針對(duì)這類請(qǐng)求一般都需要做一些保護(hù)，以防止用戶有意或無意的重復(fù)發(fā)起這樣的請(qǐng)求導(dǎo)致的數(shù)據(jù)錯(cuò)亂。本文總結(jié)了一些防止客戶端重...

sewerganger 2019-08-16 12:06 評(píng)論0 收藏0
Web前端經(jīng)典面試試題（三）

摘要：包含基于和標(biāo)準(zhǔn)的表示使用進(jìn)行動(dòng)態(tài)顯示和交互使用與服務(wù)器進(jìn)行異步通信使用綁定一切。重定向表示要完成請(qǐng)求，需要進(jìn)一步操作。方法可將一個(gè)函數(shù)的對(duì)象上下文從初始的上下文改變?yōu)橛芍付ǖ男聦?duì)象。一. 什么是Ajax？？？術(shù)語Ajax用來描述一組技術(shù)，它使瀏覽器可以為用戶提供更為自然的瀏覽體驗(yàn)。 Ajax它是Asynchronous JavaScript + XML的簡寫定義Ajax： ...

DrizzleX 2019-08-02 11:49 評(píng)論0 收藏0
Web前端經(jīng)典面試試題（三）

摘要：包含基于和標(biāo)準(zhǔn)的表示使用進(jìn)行動(dòng)態(tài)顯示和交互使用與服務(wù)器進(jìn)行異步通信使用綁定一切。重定向表示要完成請(qǐng)求，需要進(jìn)一步操作。方法可將一個(gè)函數(shù)的對(duì)象上下文從初始的上下文改變?yōu)橛芍付ǖ男聦?duì)象。一. 什么是Ajax？？？術(shù)語Ajax用來描述一組技術(shù)，它使瀏覽器可以為用戶提供更為自然的瀏覽體驗(yàn)。 Ajax它是Asynchronous JavaScript + XML的簡寫定義Ajax： ...

JackJiang 2019-08-29 17:05 評(píng)論0 收藏0
Web前端經(jīng)典面試試題（三）

摘要：包含基于和標(biāo)準(zhǔn)的表示使用進(jìn)行動(dòng)態(tài)顯示和交互使用與服務(wù)器進(jìn)行異步通信使用綁定一切。重定向表示要完成請(qǐng)求，需要進(jìn)一步操作。方法可將一個(gè)函數(shù)的對(duì)象上下文從初始的上下文改變?yōu)橛芍付ǖ男聦?duì)象。一. 什么是Ajax？？？術(shù)語Ajax用來描述一組技術(shù)，它使瀏覽器可以為用戶提供更為自然的瀏覽體驗(yàn)。 Ajax它是Asynchronous JavaScript + XML的簡寫定義Ajax： ...

HtmlCssJs 2019-08-23 12:32 評(píng)論0 收藏0