JavaScript await is only valid in async functions の原因と解決法

awaitを「asyncが付いていない普通の関数」の中で使うと発生するエラーです。関数の頭にasyncを付ければ解決します。

このエラーメッセージ

原因

• awaitを使っている関数にasyncを付けていない
• コールバック関数（forEachの中など）にasyncを付け忘れている
• モジュールでない通常スクリプトのトップレベルでawaitを使っている

❌ エラーになるコード

function getData() {
  const res = await Promise.resolve("データ取得完了");
  console.log(res);
}
getData();

✅ 修正したコード

async function getData() {
  const res = await Promise.resolve("データ取得完了");
  console.log(res);
}
getData();

解決のポイント

awaitはasyncを付けた関数の中でのみ使えます。アロー関数ならasync () => {...}のように書きます。forEachのコールバックにasyncを付けても完了を待てないため、順番に待ちたい場合はfor...ofループを使うのが定石です。

よくある質問