如何使用两个回调（WIX corvid）在 JavaScript 中返回异步调用答案

【问题标题】：How to return asynchronous calls in JavaScript with two callbacks (WIX corvid)如何使用两个回调（WIX corvid）在 JavaScript 中返回异步调用
【发布时间】：2020-11-02 20:42:18
【问题描述】：

下面的异步函数返回2个回调，所以我做了我通常做的返回响应

在获取之前添加了返回
在结果前添加了 return (json.access_token)

但这次console.log(httpResponse, 'fetch json') 在控制台上未定义，console.log(json.access_token) 返回正确的值。

我需要改变什么？

来自客户

GetJSON(NewURLCode).then(httpResponse => {
  console.log(httpResponse, 'fetch json')
}

来自服务器

GetJSON(NewURLCode){
  return fetch("https://accounts.google.com/o/oauth2/token", {
    "method": "post",
    "headers": {
      "Content-Type": 'application/x-www-form-urlencoded'
    },
    'body': data
  }).then((httpResponse) => {
    if (httpResponse.ok) {
      return httpResponse.json();
    } else {
      return Promise.reject("Fetch did not succeed");
    }
  }).then((json) => { 
    console.log(json.access_token)
    return json.access_token
  }).catch(err => console.log(err));
}

与前面的函数不同，下面的函数只有一个promise，并从客户端返回正确的对象

客户

insert_coll ('Token',toInsert).then((ins_result) => {consule.log(ins_result)}

后端

insert_coll{
return wixData.update(myCollection, toUpdate, options)
.then( ( results) => {
let item = results; //see item below
return results

} )
.catch( (err) => {
let errorMsg = err;
} );

} 
}

【问题讨论】：

你在httpResponse.json();和Promise.reject(…)前面缺少returns
你不是 returning httpResponse.json() - 或 Promise.reject() 在你的第一个然后阻止
我编辑了我的 Q 并在 httpResponse.json() 之前添加了一个返回语句，但在客户端控制台上继续获得 null，在服务器控制台上继续获得 JSON。

标签： javascript asynchronous async-await velo

【解决方案1】：

因为return语句没有产生错误，我在httpResponse.json();之前加了一个return

这是因为 WIX onReady 组件调用了两次...

所以为了解决这个问题，我使用了以下WIX solution：

$w.onReady(function () {
  if (wixWindow.rendering.env === "browser") {

//your code
}})

【讨论】：

【解决方案2】：

您可以返回 fetch 本身，并在客户端处理这些内容。喜欢，

服务器

GetJSON(NewURLCode){
  return fetch("https://accounts.google.com/o/oauth2/token", {
    "method": "post",
    "headers": {
      "Content-Type": 'application/x-www-form-urlencoded'
    },
    'body': data
  });
}

客户

GetJSON(NewURLCode).then(httpResponse => {
    if (httpResponse.ok) {
      httpResponse.json();
    } else {
      Promise.reject("Fetch did not succeed");
    }
  }).then((json) => { 
    console.log(json.access_token)
    return json.access_token
  }).catch(err => console.log(err));
}

否则，只需在服务器中解决这些问题后返回一个 Promise。喜欢，

服务器

async GetJSON(NewURLCode){
    return new Promise(async (resolve, reject) => {
        try {
            const httpResponse= await fetch("https://accounts.google.com/o/oauth2/token", {
                "method": "post",
                "headers": {
                    "Content-Type": 'application/x-www-form-urlencoded'
                },
                'body': data
           });

           if (httpResponse.ok) {
              const json = await httpResponse.json();
              resolve(res.access_token);
           } else {
              reject("Fetch did not succeed");
           }
        } catch(err) {
            reject(err);
        }
   });
}

客户

GetJSON(NewURLCode).then(httpResponse => {
  console.log(httpResponse, 'fetch json')
}).catch(err => console.log(err));

【讨论】：

第二个代码不起作用，我收到clientWorker.f4bd850c.bundle.min.js:1 Uncaught (in promise) Fetch did not succeed 错误。由于安全问题，第一个选项与我无关。