getServerSidePropsでなぜawaitするのかわからない

Question

下記のサイトでNext.jsの勉強をしています
https://reffect.co.jp/react/next-js-api-route

export async function getServerSideProps() {
  const response = await fetch('http://localhost:3000/api/users')
  const data = await response.json()

  return { props: { data } }
}

の３行目で、なぜawaitする必要があるのでしょうか
そもそも、getServerSidePropsをasyncで囲む理由もわかりません

Nextの仕様なのか、非同期処理で理解しきれていないところがあるのか、教えていただけるとありがたいです

Answer 1

fetchは通信に時間がかかるので、非同期処理にしてawaitするのは理解できますか？
response.json() も非同期処理のため、awaitで処理の完了を待ち合せます。
awaitするためにはasync関数の中でなければいけません。
Nextの仕様というよりは、JavaScriptの非同期処理の書き方です。

async/await の代わりに .then-.catch でコールバック処理を書くこともできます。

https://developer.mozilla.org/ja/docs/Web/API/Fetch_API/Using_Fetch
https://developer.mozilla.org/ja/docs/Web/API/Response/json

Comments

[退会済みユーザー]

回答ありがとうございました
色々と理解できていなかったようで、助かりました