API ルート

例

API ルートは Next.js でAPIを構築する簡単な方法を提供しています。

pages/apiフォルダ内にあるすべてのファイルは /api/* にマッピングされ、pageの代わりに API エンドポイントとして扱われます。

例えば、以下の API ルート pages/api/user.js は json レスポンスを扱います:

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

API ルートを使用するためには、関数(リクエストハンドラ)をデフォルトとしてエクスポートする必要があり、この関数は以下の 2 つのパラメータを受け取ります:

req: http.IncomingMessageのインスタンスと、こちらにある組み込みミドルウェア。
res: http.ServerResponseのインスタンスと、こちらにあるヘルパー関数。

API ルートで異なる HTTP メソッドを処理するには、次のようにリクエストハンドラの req.method を使うことができます:

export default (req, res) => {
  if (req.method === 'POST') {
    // POSTリクエストを処理します
  } else {
    // その他のHTTPメソッドを処理します
  }
};

API エンドポイントを取得するには、このセクションの最初にある例のどれかをご覧ください。

API ルートはCORSヘッダーを指定しません。つまり、標準では同一オリジンのみとなります。cors ミドルウェアでリクエストハンドラをラップすることで挙動をカスタマイズすることができます。

API ルートを使用しても、クライアントサイドのバンドルサイズが大きくなることはありません。これらはサーバーサイドのみのバンドルです。

API ルート

関連事項

API ミドルウェア

レスポンスヘルパー

TypeScript

Was this helpful?