Question

我正在从我的js文件中提取API调用，我怀疑当我使用Async / await时，代码仍以异步方式执行。

我也尝试过在其他地方等待，但是它不起作用。

 let info
 async function weather(){
 // API call
 let data=await fetch('http://api.openweathermap.org/data/2.5/weather?'+'&lat=20&lon=44'+'&units=metric'+'&APPID='+WEATHER_KEY)
  console.log("inside API")
  const res= await data.json();
  console.log(res)
 }
weather()
console.log("last part")

输出：

最后一部分

内部API

“资源价值”

我的期望：

内部API

“资源价值”

最后一部分

我们将不胜感激。

Answer 1

最简单的方法是将其包装在另一个async函数中，以便您可以await weather()。

// this function fetches the weather then logs the result
async function weather() {
  // API call
  let data = await fetch('http://api.openweathermap.org/data/2.5/weather?'+'&lat=20&lon=44'+'&units=metric'+'&APPID='+WEATHER_KEY);
  console.log('inside API');
  const res = await data.json();
  console.log(res);
}

// this async function awaits for weather() to return
async function run() {
  await weather();
  console.log('last part');
}

// this runs first
run();

Answer 2

// async function
async function fetchAsync () {
  // await response of fetch call
  let response = await fetch('http://api.openweathermap.org/data/2.5/weather?'+'&lat=20&lon=44'+'&units=metric'+'&APPID='+WEATHER_KEY);
  // only proceed once promise is resolved
  let data = await response.json();
  // only proceed once second promise is resolved
  return data;
}

// trigger async function
// log response or catch error of fetch promise
fetchAsync()
    .then(data => console.log(data))
    .catch(err => console.log(err))

Answer 3

在节点环境中运行的脚本中的解决方案：

(async function () {

  // API call
  const data = await fetch('http://api.openweathermap.org/data/2.5/weather?'+'&lat=20&lon=44'+'&units=metric'+'&APPID='+WEATHER_KEY)
  console.log("inside API")

  const res = await data.json();
  console.log(res)

  console.log("last part")
})()

消息将按预期顺序显示。

异步/ await无法在javascript中进行提取API调用

3 个答案: