解析并等待 ajax 调用 forEach

Question

我知道这里已经找到了问题和答案，这就是我得到示例的地方。问题是：Other question

这是我的代码：

$('.start').click(function() {
    Generate();
})

function Generate()
{
    var _p = Promise.resolve();
    customers.forEach(customer =>
       _p = _p.then(() => AxCall(customer))
    );
}

function AxCall(v)
{
    $.ajax({
        url: '/generate/axgenerate/'+v['clm_customer_id'],
        complete: function() {
            count++;
            $('.completed').text(count);
        }
    })
}

问题是仍然在这里调用的 ajax 被同时触发。我该怎么做才能使 ajax 呼叫一个接一个地触发，即使它失败或成功

Answer 1

您需要 return 调用 $.ajax 的结果。 return 值是一个 jQuery 承诺：

function AxCall(v)
{
    return $.ajax({
//  ^^^^^^
    // ...

这样，您设置的承诺链 forEach 使链中的每一步都等待上一步完成。

但是既然ajax无论成功还是失败都想继续，还需要把rejection转化为fulfillment，所以：

customers.forEach(customer =>
    _p = _p.then(() => AxCall(customer).catch(error => {});
// −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−^^^^^^^^^^^^^^^^^^
);

（您可能会以某种方式报告错误，但这里的关键是 catch 将捕获拒绝并将其转换为履行 [如果您不 throw 或 return is/will 被拒绝的承诺。）

如果能用async函数和await就简单一点：

async function Generate()
{
    for (const customer of customers) {
        try {
            await $.ajax({
                url: '/generate/axgenerate/'+v['clm_customer_id'],
                complete: function() {
                    count++;
                    $('.completed').text(count);
                }
            });
        } catch (error) {
            // (perhaps report error here)
        }
    }
}

解析并等待 ajax 调用 forEach

Resolve and Wait ajax call in forEach

javascript

ajax

jquery

promise