执行 api 并等待 javascript 中的响应代码执行

Question

在执行后续结果之前，我需要等待 api 响应返回。 所以我尝试在 js 中调用 promise 。 但它仍然没有等待 api 响应。 我的尝试如下。

 getAgentList(data); //here data object receiving data
 console.log("executed before the api response");
  var getAgentList = function (dataFromMsg) {
  const myPromise = new Promise(function (resolve, reject) {
    
    let accountNum = window.localStorage.account;
    fetch("/web/main?account=" + accountNum, {
      method: "GET",
    })
      .then(function (res) {
        return res.json();
      })
      .then(function (data) {
        let friendArrList = data.data.friend[0].list;
        
        for (let i = 0; i < friendArrList.length; i++) {
          if (friendArrList[i].id == dataFromMsg.id) {
            dataFromMsg.avatar = friendArrList[i].avatar;
            dataFromMsg.username = friendArrList[i].username;
            break;
          }
        }
        dataFromMsgG = JSON.parse(JSON.stringify(dataFromMsg)); //dataFromMsgG is global object
     
        resolve("fine");
      })
      .catch((error) => {
        console.error("Error:", error);
        reject("error");
      });

   
  });

  myPromise
    .then(function whenOk(response) {
      console.log("response", response);
      return response;
    })
    .catch(function notOk(err) {
      console.error(err);
    });
  };
}

但它会打印“在 api 响应之前执行”行，而无需等待 api 响应。 那么我在哪里弄错了，怎么能等到 api 响应成功？

Answer 1

我建议将await和async与 promise 一起使用。 由于await 仅在 async function 中有效，因此我必须将您的代码放入async function 中，我将其命名为main 。

<script>
    main();

    async function main() {
        
        await getAgentList();
        console.log("executed before the api response");
        
        function getAgentList() {
            const myPromise = new Promise(function (resolve, reject) {
                ///...
                ///... Your code
                ///...
            });

            myPromise
              .then(function whenOk(response) {
                  console.log("response", response);
                  return response;
              })
              .catch(function notOk(err) {
                  console.error(err);
              });
           
            return myPromise;
        }
    }