Best practices for using Prisma Client with Next.js and Next.js Data Cache

Problem

When deploying a Next.js app, you may run into an issue where your queries are not updating or displaying the correct content. Or, you may find that it takes a long time for newly created objects to show up in your queries.

In these cases, you are most likely seeing data persisted in the Next.js Data Cache. Any fetch request has its result cached by default, leading to possibly unwanted results as Prisma uses fetch internally.

Solution

To opt-out of the Next.js Data Cache, you can disable caching for a specific route using the "force-dynamic" config option so that up to date data is always returned and no caching happens.

You can add "force-dynamic" like this:

import { NextRequest, NextResponse } from 'next/server'
import prisma from './db'

export const dynamic = 'force-dynamic'

export async function GET(request: NextRequest, response: NextResponse) {
  // your code would go here
}