为什么在Firefox上使用async时，await无法工作？

Question

基本上，我有这个函数。

async function get(url){
  const response = await fetch(url);
  const resData = await response.text();
  return resData;
}

稍后我会有这个电话。

let data = await get(am_url);

这段代码在Google Chrome上运行得非常完美，但在Firefox上，在调用行上出现了以下错误：

SyntaxError: await仅适用于异步函数和异步生成器

问题在哪里？我已经尝试了很多方法，但就是无法让它在Firefox上正常工作。

例如，如果我在Firefox和Google Chrome上打开google.com，然后进入控制台，并粘贴此代码，则在Chrome上它将运行，但在Firefox上它会抛出我提到的错误。

async function get(url){
  const response = await fetch(url);
  const resData = await response.text();
  return resData;
}

let data = await get("http://google.com");
console.log(data)

- J Doe

---

听起来像是 data 不在一个 async 函数中？ - CertainPerformance

因为Response.text()返回一个Promise吗？ - Kaiido

好的，这是fetch，我忘了。 - Aakash Verma

请尝试提供一个[MCVE]。您可以使用StackSnippets（[<>]图标）在问题中包含这样的示例。目前，我们缺少很多上下文来看到问题所在。此示例在Chrome中也失败了。 - Kaiido

从控制台开始...现在，FF的哪个版本？我的65 beta频道也将控制台上下文包装在一个async函数中（所以我仍然无法重现）。 - Kaiido

Answer 1

在主函数中，您可以将以下代码放入自执行的异步函数中，或者使用.then。

let data = await get(am_url);

应该改为

(async()=>{ let data = await get(am_url) })()

或者

get(am_url).then( data => ....)

- Sumer

---

这并不能解释为什么一个浏览器可以接受它而另一个浏览器却不行。 - Kaiido

我先尝试了.then，但它没有起作用，于是我开始尝试不同的方法，并最终得到了上面的代码。当我使用.then符号时，有时会得到空数据，这意味着它没有等待响应。 - J Doe

异步获取功能在遇到 await 时会在内部暂停执行。执行完成后，它将把数据传递给主 .then。您还可以在 .then 函数后添加 .catch 来检查是否返回了拒绝的 Promise。 - Sumer

Answer 2

作为错误提示，await 只能在 async 函数内部使用。通常情况下，您不能像那样使用 await，但您必须首先创建一个 async 函数或者使用 .then() 而不是 await。但是有两件事需要注意：

1. 控制台支持在async函数之外使用await，以简化您的生活。Chrome最先做到了这一点，然后Firefox最近也实现了。现在您的示例在两个浏览器中都可以工作。
2. 在未来的ECMAScript版本中，您将能够在async函数之外使用await，这称为"顶级await"，因此该代码很快将在所有地方（在type="module"上下文中）起作用

- fregante

---

这个解释比得到最多赞的答案更清楚地说明了问题所在。 - Ezbob

Answer 3

在2018年提出这个问题时，大多数JavaScript控制台不支持顶层的Await。

当时，谷歌Chrome开发者工具控制台是一个例外。他们在2017年底，在Chrome 62中添加了此功能。

这就是为什么，在你提出这个问题时使用的Firefox版本中，你必须解决Promise，例如使用then/catch。

如果你更新到当前的Firefox版本，如2020年初的版本72，你问题中的代码将能够正常工作。正如fregante在评论中指出的那样，2019年Firefox升级了他们的控制台以支持顶层的await。

- dcorking

---

Firefox去年还在控制台中添加了对它的支持 https://bugzilla.mozilla.org/show_bug.cgi?id=1414726 - fregante