Next.js-Apiルート

APIルートは、Next.jsを使用してRESTAPIを作成する方法です。Next.jsは、に存在するすべてのファイルをマップします/pages/apiフォルダであり、APIエンドポイントとして扱われます。API関数の例-

export default (req, res) => {
   ...
}

以下は考慮すべきいくつかの重要なポイントです。

req − reqはhttp.IncomingMessageのインスタンスであり、リクエストからデータを取得するために使用されます。
res − resはhttp.ServerResponseのインスタンスであり、応答としてデータを送信するために使用されます。

同じことを示す例を作成しましょう。

この例では、でuser.jsを作成します。 pages/api ディレクトリ。

グローバルCSSサポートの章で使用されているnextjsプロジェクトを更新しましょう。

次のように、pages / apiディレクトリにuser.jsファイルを作成します。

export default (req, res) => {
   res.statusCode = 200
   res.setHeader('Content-Type', 'application/json')
   res.end(JSON.stringify({ name: 'Robert' }))
}

Next.jsサーバーを起動します

次のコマンドを実行してサーバーを起動します-。

npm run dev

> [email protected] dev D:\Node\nextjs
> next

ready - started server on http://localhost:3000
info  - Loaded env from D:\Node\nextjs\.env.local
event - compiled successfully
event - build page: /api/user
wait  - compiling...
event - compiled successfully
event - build page: /next/dist/pages/_error
wait  - compiling...
event - compiled successfully

出力を確認する

ブラウザでlocalhost：3000 / api / userを開くと、次の出力が表示されます。

{"name":"Robert"}