使用 async/await 在另一个内部运行异步函数无法连接/获取资源答案

【问题标题】：Running an asynchronous function inside another with async/await fails to connect/fetch resource使用 async/await 在另一个内部运行异步函数无法连接/获取资源
【发布时间】：2019-10-05 23:17:21
【问题描述】：

我正在使用 Node 和 Express 构建一个 Web 应用程序。我有一个 HTML 页面，它使用 Fetch API 向我的 API 发出请求。在我的表中，每行都有一个X 按钮，用于删除该任务（它工作正常。）但是，删除函数deleteTask 然后调用我的tableTasks 函数以使用新数据重新加载表。请求失败，并显示错误消息：

加载资源失败：无法连接到服务器未处理的 Promise Rejection：TypeError：无法连接到服务器。

带有指向正确 API 端点的链接，当从不同来源（浏览器、邮递员、表单页面上的不同按钮）打开该端点时，会正确产生结果。

我已经尝试将await 关键字从deleteTask 内部重新定位到await tableTasks，并使用return。现在，我的代码在tableTasks 内运行，并停在这一行：

const response = await fetch("http://XX.XX.XXX.XXX:3000/list");

出现上述错误。我尝试将await 更改为.then 语法并将tableTasks 的其余部分放在回调函数中，但无济于事。

在deleteTask:

tableTasks(false);

在tableTasks:

async function tableTasks() {
    //Initialization
    const response = await fetch("http://XX.XX.XXX.XXX:3000/list");
    const data = response.json();
    //Do stuff with data
}

我的期望是，当调用此函数时，它会重新加载表，但会出错。我是否需要在某个地方额外放置一个await，或者以其他方式等待回复？

【问题讨论】：

将异步函数内的代码封装在 try/catch 块中
@AmitDas 已经报错了，为什么还要try/catch？
fetch 命令返回一个promise。一个承诺有 2 个部分。 Resolve 和 Reject。 await 关键字返回从 resolve 部分返回的任何内容。如果fetch 中有错误，reject 将执行。您还需要处理，否则您将收到上述错误。似乎还有一些服务器连接错误。
这是确切的错误信息吗？这是非标准的，我只能找到couple 结果，我很惊讶内置的fetch 会拒绝该消息。大胆猜测，HTML 页面不在 HTTPS 上，对吧？（如果它恰好在 HTTPS 上，那可能就是问题所在）。另一个随机的想法，也许看看你使用XMLHttpRequest时会发生什么@
不，服务器不通过 HTTPS 运行。

标签： javascript html node.js ecmascript-6 es6-promise

【解决方案1】：

始终将您的 async 函数封装在 try/catch 块中，如下所示：

async function f() {
    try{
          await asynchronous_method();
    }catch(err){
           //Handle Rejection.
    }
}

fetch 命令返回一个promise。一个承诺有 2 个部分。 Resolve 和 Reject。 await 关键字返回从 resolve 部分返回的任何内容。如果fetch 中有错误，reject 将执行。您还需要处理，否则您将收到上述错误。似乎还有一些服务器连接错误。

【讨论】：