進行 ajax 調用時如何正確重用代碼

Question

我正在使用最新的 JQuery (3.6)。我的代碼中有多個 ajax 調用到同一個端點。 我必須制作重復的方法，因為根據響應，在.done function 中，我必須應用單獨的業務邏輯，如果出現錯誤，應用額外的邏輯向用戶顯示錯誤。 我想知道我是否可以重復使用相同的 ajax 調用代碼，因為這不會改變。 這是我的 JS 函數：

js function 1

function dosomething1(req) {

    var send_on = "/api/url";
    var timeoutTime = 10000;

    $.ajax({
        type: "POST",
        url: send_on,
        contentType: 'application/json',
        data: JSON.stringify(req),
        cache: false,
        dataType: "json",
        tryCount: 0,
        retryLimit: 1,
        timeout: timeoutTime
    })
        .done(function(response) {
            // this is where I'm doing my businses logic
            do_very_specific1_to_response(response);
        })
        .fail(function(xhr, status, error) {
            // this is where I'm doing error handling
            handle_very_specific1_to_response();
}

js function 2

function dosomething2(req) {

    var send_on = "/api/url";
    var timeoutTime = 10000;

    $.ajax({
        type: "POST",
        url: send_on,
        contentType: 'application/json',
        data: JSON.stringify(req),
        cache: false,
        dataType: "json",
        tryCount: 0,
        retryLimit: 1,
        timeout: timeoutTime
    })
        .done(function(response) {
            // this is where I'm doing my businses logic
            do_very_specific2_to_response(response);
        })
        .fail(function(xhr, status, error) {
            // this is where I'm doing error handling
            handle_very_specific2_to_response();
}

如您所見，我沒有為 ajax 請求和重試邏輯更改任何內容，這始終是相同的，改變的是我處理響應的方式。

我正在考慮應用$.when().then()機制，但不確定它將如何處理重試邏輯。

Answer 1

一種方法是將 ajax 調用包裝在 promise 中。

function dosomething(req) {
    return new Promise((resolve, reject) => {
        var send_on = "/api/url";
        var timeoutTime = 10000;

        $.ajax({
            type: "POST",
            url: send_on,
            contentType: 'application/json',
            data: JSON.stringify(req),
            cache: false,
            dataType: "json",
            tryCount: 0,
            retryLimit: 1,
            timeout: timeoutTime
        })
            .done(function(response) {
                // this is where I'm doing my businses logic
                resolve(response);
            })
            .fail(function(xhr, status, error) {
                // this is where I'm doing error handling
                reject(error);
            })
}

function dosomething1(req) {
    dosomething(req)
        .then(response => {
            do_very_specific1_to_response(response);
        })
        .catch(error => {
            handle_very_specific1_to_response();
        })
}

function dosomething2(req) {
    dosomething(req)
        .then(response => {
            do_very_specific2_to_response(response);
        })
        .catch(error => {
            handle_very_specific2_to_response();
        })
}