jQuery AJAX在另一個響應后停止請求

Question

我有一個問題，我需要一個解決的主意:)

我有2個調用$ .ajax的電話，首先是異步的，並且在很多時間（例如1分鍾）內，其次是sync（在ajax async：false）中，並且響應速度很快（例如5 sec）

第二次調用處於循環中（請求->響應->打印數據，請求->響應->打印數據）。 我需要第一次完成（成功或錯誤）時，停止第二次通話。

我附上示例代碼：

var success = false;
$.ajax({
    type: "POST",
    url: urlRest,
    data: {
        data: dataSend
    },
    success: processOK,
    error: processError
});

do {
    $.ajax({
        type: "POST",
        url: urlData,
        data: {
            data: dataSend
        },
        async: false,
        success: function(data, textStatus, jqXHR){
            console.log(data);              
        },
        error: function(data, textStatus, jqXHR){
            console.log("Error");   
        }  
    }); 
} while (!success);

我希望很清楚:)

Answer 1

我更正了會導致一些錯誤的問題，請嘗試一下。

let printData = function( input ){

    let config = {
        urlRest: '',
        data: { data: {} },
        loop: false,
        callback: false
    }

    $.each(config,function(k,v){ config[k] = input[k]   });
        config.loop = false;

        $.ajax({
            type: 'POST',
            url: config.urlRest,
            data: config.data,
            success: function( data ){

                // Based on the response if you need to run again change config.loop to true and it will run again
                // you can also alter anything your sending through

                if( config.loop ) printData( config );
                else if( typeof config.callback === 'function' ) callback();
            },
            error: function(){

                // Based on the response if you need to run again change config.loop to true and it will run again
                // you can also alter anything your sending through

                if( config.loop ) printData( config );
                else if( typeof config.callback === 'function' ) callback();

            }       
        });
}

printData({
    urlRest: '', // URL Here
    data: data,  // Data Object
    loop: true,   // Set this to true if you want it to loop
    callback: function(){
        console.log( 'Job Complete' );
    }
})

Answer 2

您可以使用SynJS以同步方式運行異步調用：

function ajaxWrapper(ctx, url, data){
    var res={done:false};
    $.ajax({
        type: "POST",
        url: url,
        data: data,
        success: function(result){
            res.data=result;
        },
        error: function(){
            res.error=true;
        },
    }).always(function(){
        res.done = true;
        SynJS.resume(ctx); // <-- tell caller that callback is finished
    });
    return res; // <-- return object that will hold the results
}

// function that is executed in synchronous manner
function myFunc(modules, urlRest, urlData) {
    var success = false;

    var res1 = modules.ajaxWrapper(_synjsContext, urlRest, urlData);
    SynJS.wait(res1.done); // <-- wait for result from callback

    do {
        var res2 = modules.ajaxWrapper(_synjsContext, urlRest, urlData);
        SynJS.wait(res2.done); // <-- wait for result from 2nd callback
    } while (!success);
}
var modules = {ajaxWrapper: ajaxWrapper};
SynJS.run(myFunc,null, modules, "/", {}, function () {
    console.log('done');
});

Answer 3

您可以像這樣更改成功值

$.ajax({
    type: "POST",
    url: urlRest,
    data: {
        data: dataSend
    }
}).always(function() {success=true;});

或者，您可以創建一個自調用函數（在第二個ajax完成之后，再次調用它），但是在調用之前，它會像@mplungjan一樣檢查成功變量。

Answer 4

循環使用Ajax絕不是一個好主意。 您需要允許呼叫返回。 這是一個不使用異步false的示例

 var firstDone = false,tId; // call long ajax $.ajax({ type: "POST", url: urlRest, data: { data: dataSend } }).done(processOK); }).fail(processError) }).always(function() {firstDone=true; clearTimeout(tId);}); // stops the other loop // setup function that can be looped function callAjax() { if (firstDone) return; $.ajax({ type: "POST", url: urlData, data: { data: dataSend } }).done(function(data, textStatus, jqXHR) { console.log(data); }).fail(function(data, textStatus, jqXHR) { console.log("Error"); }).always(function() { tId=setTimeout(callAjax,1000); // give the server time to recover }); } callAjax();