💨
Next.js API ルートと Prisma クライアントの非同期処理

2025/04/24に公開
 はじめに以下では、非同期処理（async/await）に慣れていない方向けに、
どうやってコードを読むか
どうやってコードを書くか

の2点を解説します。

 1. 非同期関数（async/await）のおさらい
async function：関数を非同期関数にするキーワード。戻り値は常に Promise。

await：Promise の完了（resolve）を待ってから次の処理へ進む。
async function fetchData() {
    // ここで非同期処理を待つ
    const data = await fetch("https://api.example.com/data");
    return data.json();
}

 2. コードを読む流れ以下の例を読みながらポイントを押さえましょう。
import { PrismaClient } from "@prisma/client";
import { NextResponse }   from "next/server";

const prisma = new PrismaClient();

export const GET = async (req: Request) => {
  try {
    // ① Prisma からデータを取得
    const posts = await prisma.post.findMany();
    // ② 取得結果を JSON で返却
    return NextResponse.json(
      { message: "success", posts },
      { status: 200 }
    );
  } catch (err) {
    // ③ エラー時の返却
    return NextResponse.json(
      { message: "error", err },
      { status: 500 }
    );
  }
};
インポート

PrismaClient：DB へのクエリを送るクライアント

NextResponse：Next.js のレスポンス生成ユーティリティ
インスタンス生成
const prisma = new PrismaClient();
これで prisma.post.findMany() などのメソッドが使えるようになります。
GET ハンドラー

async (req)：非同期関数として宣言

try { await prisma... }：クエリ実行を待機

NextResponse.json()：JSON レスポンスを返す

 3. コードを書く手順ファイルの配置

Next.js App Router では route.ts に置きます。
依存パッケージの準備
npm install @prisma/client
npx prisma generate
インポート＆クライアント生成
import { PrismaClient } from "@prisma/client";
const prisma = new PrismaClient();
API ハンドラーの定義
export const GET = async (req: Request) => { ... }
DB クエリ
const posts = await prisma.post.findMany();
レスポンス返却
return NextResponse.json({ message: "success", posts }, { status: 200 });

 4. 実践例：エラーハンドリング付き GET以下は「読みやすく」「書きやすい」構成のサンプルです。
import { PrismaClient } from "@prisma/client";
import { NextResponse }   from "next/server";

// グローバルにインスタンスを使い回すと接続コストを削減できる
const prisma = new PrismaClient();

export const GET = async (req: Request) => {
  try {
    // DB から全記事を取得
    const posts = await prisma.post.findMany();
    return NextResponse.json(
      { message: "success", posts },
      { status: 200 }
    );
  } catch (error) {
    console.error("DB Error:", error);
    return NextResponse.json(
      { message: "error", detail: error instanceof Error ? error.message : String(error) },
      { status: 500 }
    );
  }
};

 5. まとめ
読むとき: まず import → クライアント生成 → ハンドラーの流れを追う

書くとき:
インポート
クライアント生成

async 関数定義

await でクエリ（try/catch で囲む）

NextResponse.json で返却

この流れを意識すれば、非同期関数に不慣れでもスムーズに理解・実装できます。
はじめに

1. 非同期関数（async/await）のおさらい

2. コードを読む流れ

3. コードを書く手順

4. 実践例：エラーハンドリング付き GET

5. まとめ

Discussion
