等待異步操作的結果

Question

我有這樣的API用於異步請求

 request(pathParams, params, method, callback, error) {

        ...........

        return $.ajax({
            ...requestAttrs,
            url: url,
            data: params,
            xhrFields: {
                withCredentials: true
            },
            type: method,

            success: callback,
            error: error
        })
    }

但是由於某些要求，我需要將其更改為

request(pathParams, params, method, callback, error) {

            ...........
            someAsyncFunction(function(){
                return $.ajax({
                ...requestAttrs,
                url: url,
                data: params,
                xhrFields: {
                    withCredentials: true
                },
                type: method,

                success: callback,
                error: error
            })      

            })

        }

我希望你看到我的問題。 在前一種情況下，我使用了$.ajax調用返回的值-例如，因為我將取消這些請求。

但是現在當我需要將ajax函數放入另一個異步函數中時，我無法像以前一樣返回$ .ajax值（因為現在我將return移動到了someAsyncFunction內部）。

有沒有辦法我可以先在請求中運行someAsyncFunction ，等待其完成，然后像以前一樣返回$.ajax ？

像stratified.js庫這樣可用於此嗎？

---

someAsyncFunction是來自此處的 updateToken函數。 基本上，我需要將之前request放入updateToken的成功回調中，但是問題是我現在不能像以前那樣返回$ajax 。

Answer 1

我可以自由更改您的代碼。

我的方法是盡可能地分離代碼，以免陷入“ 回調地獄” 。

1. 創建someAsyncFunction並根據需要進行判斷，然后返回其值

2. 同樣適用於您的ajax調用。 如果需要來自someAsyncFunction的輸出，那么也很容易發送它們

3. 承諾勝利！ 鏈接所有調用並保持代碼流:)

我正在使用setTimeout所以它們看起來是異步的

 function someAsyncFunction() { return new Promise(resolve => setTimeout(() => { console.log('-> someAsyncFunction has finished') const token = 'abc123' resolve(token) }, 1000) ) } function executeAjaxRequest(pathParams, params, method, token) { return new Promise(resolve => { setTimeout(() => { console.log('-> executeAjaxRequest has finished') resolve() }, 2000) }) } function request(pathParams, params, method) { someAsyncFunction() .then((token) => executeAjaxRequest(pathParams, params, method, token)) .then(() => console.log('-> end!')) } request('pathParams', 'params', 'method') 

示例代碼someAsyncFunction和keycloak東西:)

function someAsyncFunction() {
  return new Promise((resolve, reject) => {
    keycloak.updateToken(30)
      .success(resolve)
      .error(reject)
  })
}

Answer 2

好的，我知道您的問題出在哪里。 道歉沒有考慮清楚。 $.ajax返回的jqXHR以兩種方式起作用：既作為承諾，又作為可以在完成之前中止它的句柄。 第一個要求我們返回它，以便我們可以繼續承諾鏈。 第二個要求我們保留它，以便我們可以在承諾鏈之外實現它。

function authenticateWithKeycloak() {
  return new Promise((resolve, reject) => {
    keycloak.updateToken(30)
      .success(resolve)
      .error(reject)
  })
}    

function request(...) {
  let promise = authenticateWithKeycloak();
  promise.abort = () => { promise.aborted = true; }
  return promise.then(authenticated => {
    if (!promise.aborted) {
      let xhr = $.ajax({...});
      promise.abort = () => xhr.abort();
    }
    return promise;
  })
}

let reqPromise = request(...);
reqPromise.then(...);
reqPromise.abort();

編輯：允許在AJAX之前中止。

Answer 3

您可能想要這樣做。 希望這適合您的情況。 如果我誤解了，請在評論中輸入。

在這里，我只是返回了一個字符串，您可以編輯以返回ajax請求。

 function someAsyncFunction(callback) { //do something return callback(); } function request(pathParams, params, method, callback, error) { return someAsyncFunction(function(){ return "Ajax request"; }); } console.log(request());