Prisma•2mo ago

TypeError: The "payload" argument must be of type object. Received null

There's an ongoing issue in our codebase where Prisma queries that fail give the error in the title, which isn't the typical error we see in other projects. Our project is using NextJS 15.0.2 and Prisma (with neon serverless adapter) 5.22.0. Here is the client:

import { Pool } from "@neondatabase/serverless";
import { PrismaNeon } from "@prisma/adapter-neon";
import { PrismaClient } from "@prisma/client";

const globalForPrisma = global as unknown as { prisma: PrismaClient };

function makeClient() {
    const neon = new Pool({ connectionString: process.env.DATABASE_URL });
    const adapter = new PrismaNeon(neon);
    return new PrismaClient({ adapter });
}

const db = globalForPrisma.prisma || makeClient();

if (process.env.NODE_ENV === "development") {
    globalForPrisma.prisma = db;
}
export default db;

8 Replies

RaphaelEtim•2mo ago

Hi @яσчαℓтℓя Can you please enable detailed debugging and share the relevant logs? https://www.prisma.io/docs/orm/prisma-client/debugging-and-troubleshooting/debugging

export DEBUG="*"

export DEBUG="*"

Debugging (Reference) | Prisma Documentation

This page explains how to enable debugging output for Prisma Client by setting the DEBUG environment variable.

Zeke•4w ago

Getting the exact same thing

Zeke•4w ago

message.txt

Zeke•4w ago

Relevant API route.ts:

import { NextResponse } from "next/server";
import { auth } from "@/auth";
import prisma from "@/prisma";
import { isStaff } from "@/lib/Staff";

export async function GET() {
  try {
    const now = new Date();
    const shows = await prisma.show.findMany({
      where: {
        startTime: { gt: now },
      },
      orderBy: { startTime: "asc" },
      include: { host: true },
    });

    return NextResponse.json(shows);
  } catch (error) {
    console.error("Error fetching shows:", error);
    return NextResponse.error();
  }
}

export async function POST(req: Request) {
    const session = await auth();
  
    if (!session || !session.user?.id) {
        return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
    }

    if (!isStaff(session.user.id)) {
        return NextResponse.json({ error: "Forbidden" }, { status: 403 });
    }

    try {
        const formData = await req.formData();

        const name = formData.get("name");
        const hostId = formData.get("hostId");
        const startTime = formData.get("startTime");
        const endTime = formData.get("endTime");

        if (!name || !hostId || !startTime || !endTime) {
            return NextResponse.json({ error: "All fields are required." }, { status: 400 });
        }
  
        const start = new Date(startTime.toString());
        const end = new Date(endTime.toString());
  
        if (isNaN(start.getTime()) || isNaN(end.getTime())) {
            return NextResponse.json({ error: "Invalid date format." }, { status: 400 });
          }
  
          if (start >= end) {
            return NextResponse.json({ error: "Start time must be before end time." }, { status: 400 });
          }
  
          const show = await prisma.show.create({
            data: {
              name: name.toString(),
              startTime: start,
              endTime: end,
              host: {
                connect: { id: hostId.toString() },
              },
            },
            include: { host: true },
          });
  
      return NextResponse.json(show);
    } catch (error) {
      console.error("Error creating show:", error);
      return NextResponse.json({ error: "Failed to create show." }, { status: 500 });
    }
  }

import { NextResponse } from "next/server";
import { auth } from "@/auth";
import prisma from "@/prisma";
import { isStaff } from "@/lib/Staff";

export async function GET() {
  try {
    const now = new Date();
    const shows = await prisma.show.findMany({
      where: {
        startTime: { gt: now },
      },
      orderBy: { startTime: "asc" },
      include: { host: true },
    });

    return NextResponse.json(shows);
  } catch (error) {
    console.error("Error fetching shows:", error);
    return NextResponse.error();
  }
}

export async function POST(req: Request) {
    const session = await auth();
  
    if (!session || !session.user?.id) {
        return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
    }

    if (!isStaff(session.user.id)) {
        return NextResponse.json({ error: "Forbidden" }, { status: 403 });
    }

    try {
        const formData = await req.formData();

        const name = formData.get("name");
        const hostId = formData.get("hostId");
        const startTime = formData.get("startTime");
        const endTime = formData.get("endTime");

        if (!name || !hostId || !startTime || !endTime) {
            return NextResponse.json({ error: "All fields are required." }, { status: 400 });
        }
  
        const start = new Date(startTime.toString());
        const end = new Date(endTime.toString());
  
        if (isNaN(start.getTime()) || isNaN(end.getTime())) {
            return NextResponse.json({ error: "Invalid date format." }, { status: 400 });
          }
  
          if (start >= end) {
            return NextResponse.json({ error: "Start time must be before end time." }, { status: 400 });
          }
  
          const show = await prisma.show.create({
            data: {
              name: name.toString(),
              startTime: start,
              endTime: end,
              host: {
                connect: { id: hostId.toString() },
              },
            },
            include: { host: true },
          });
  
      return NextResponse.json(show);
    } catch (error) {
      console.error("Error creating show:", error);
      return NextResponse.json({ error: "Failed to create show." }, { status: 500 });
    }
  }

Note the object is being created in database, however it doesn't seem to want to return back to the client after request.

RaphaelEtim•4w ago

@Zeke What do you get for show variable when you log it? Can you add this line

if (!show) {
  return NextResponse.json({ error: "Failed to create show." }, { status: 500 });
}

if (!show) {
  return NextResponse.json({ error: "Failed to create show." }, { status: 500 });
}

before

return NextResponse.json(show);

return NextResponse.json(show);

Let me know the result

яσчαℓтℓяOP•4w ago

I think this is an issue with neon serverless integration but I may be wrong We initially thought it might be NextJS 15 but we have multiple projects in NextJS 15 which show the verbose error message, but the project with neon serverless adapter shows the payload null error

Zeke•4w ago

Hi. Thanks for the reply I have switched over to using a server action implementation Here is the relevant section of my new Actions.ts:

export async function deleteHost(hostId: string) {
  const session = await auth();

  if (!session || !session.user?.id) {
    throw new Error("Unauthorized: User must be logged in.");
  }

  if (!isStaff(session.user.id)) {
    throw new Error("Forbidden: User does not have permission.");
  }

  if (!hostId) {
    throw new Error("Host ID is required.");
  }

  try {
    await prisma.host.delete({
      where: { id: hostId }
    }).catch(error => console.log(error));

    return new Response("Success!", { status: 200 })
  } catch (error) {
    console.error("Error deleting host:", error);
    throw new Error("Failed to delete host.");
  }
}

export async function deleteHost(hostId: string) {
  const session = await auth();

  if (!session || !session.user?.id) {
    throw new Error("Unauthorized: User must be logged in.");
  }

  if (!isStaff(session.user.id)) {
    throw new Error("Forbidden: User does not have permission.");
  }

  if (!hostId) {
    throw new Error("Host ID is required.");
  }

  try {
    await prisma.host.delete({
      where: { id: hostId }
    }).catch(error => console.log(error));

    return new Response("Success!", { status: 200 })
  } catch (error) {
    console.error("Error deleting host:", error);
    throw new Error("Failed to delete host.");
  }
}

And, upon catching an error in that query, I get this:

Error deleting host: TypeError: The "payload" argument must be of type object. Received null
    at frame (node_modules\next\src\server\patch-error-inspect.ts:89:42)
    at getSourcemappedFrameIfPossible (node_modules\next\src\server\patch-error-inspect.ts:179:32)
    at parseAndSourceMap (node_modules\next\src\server\patch-error-inspect.ts:234:23)
    at exit (node_modules\next\src\server\patch-error-inspect.ts:224:32)
    at apply (webpack://next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:569:32)
    at apply (webpack://next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.development.js:593:32)
    at log (app\actions.ts:141:30)
    at async deleteHost (app\actions.ts:136:4)
    at async (webpack://next/dist/src/server/app-render/action-handler.ts:881:24)
    at async handleAction (webpack://next/dist/src/server/app-render/action-handler.ts:617:4)
    at async renderToHTMLOrFlightImpl (webpack://next/dist/src/server/app-render/app-render.tsx:1310:34)
    at async doRender (node_modules\next\src\server\base-server.ts:2666:21)
    at async responseGenerator (node_modules\next\src\server\base-server.ts:3027:21)
    at async DevServer.renderToResponseWithComponentsImpl (node_modules\next\src\server\base-server.ts:3039:23)
    at async DevServer.renderPageComponent (node_modules\next\src\server\base-server.ts:3597:15)
    at async DevServer.renderToResponseImpl (node_modules\next\src\server\base-server.ts:3659:23)
    at async DevServer.pipeImpl (node_modules\next\src\server\base-server.ts:1698:20)
    at async NextNodeServer.handleCatchallRenderRequest (node_modules\next\src\server\next-server.ts:1034:6)
    at async DevServer.handleRequestImpl (node_modules\next\src\server\base-server.ts:1462:8)
    at async (node_modules\next\src\server\dev\next-dev-server.ts:514:13)
    at async Span.traceAsyncFn (node_modules\next\src\trace\trace.ts:143:13)
    at async DevServer.handleRequest (node_modules\next\src\server\dev\next-dev-server.ts:512:19)
    at async invokeRender (node_modules\next\src\server\lib\router-server.ts:284:10)
    at async handleRequest (node_modules\next\src\server\lib\router-server.ts:530:15)
    at async requestHandlerImpl (node_modules\next\src\server\lib\router-server.ts:576:6)
    at async Server.requestListener (node_modules\next\src\server\lib\start-server.ts:146:6)
  139 |         shows: true,
  140 |       },
> 141 |     }).catch(error => console.log(error));
      |                              ^
  142 |
  143 |     return new Response("Success!", { status: 200 })
  144 |   } catch (error) { {
  code: 'ERR_INVALID_ARG_TYPE'
}
 ⨯ app\actions.ts (146:11) @ deleteHost
 ⨯ Error: Failed to delete host.
    at deleteHost (./app/actions.ts:158:15)
digest: "619090243"
  144 |   } catch (error) {
  145 |     console.error("Error deleting host:", error);
> 146 |     throw new Error("Failed to delete host.");
      |           ^
  147 |   }
  148 | }
  149 |

Error deleting host: TypeError: The "payload" argument must be of type object. Received null
    at frame (node_modules\next\src\server\patch-error-inspect.ts:89:42)
    at getSourcemappedFrameIfPossible (node_modules\next\src\server\patch-error-inspect.ts:179:32)
    at parseAndSourceMap (node_modules\next\src\server\patch-error-inspect.ts:234:23)
    at exit (node_modules\next\src\server\patch-error-inspect.ts:224:32)
    at apply (webpack://next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:569:32)
    at apply (webpack://next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.development.js:593:32)
    at log (app\actions.ts:141:30)
    at async deleteHost (app\actions.ts:136:4)
    at async (webpack://next/dist/src/server/app-render/action-handler.ts:881:24)
    at async handleAction (webpack://next/dist/src/server/app-render/action-handler.ts:617:4)
    at async renderToHTMLOrFlightImpl (webpack://next/dist/src/server/app-render/app-render.tsx:1310:34)
    at async doRender (node_modules\next\src\server\base-server.ts:2666:21)
    at async responseGenerator (node_modules\next\src\server\base-server.ts:3027:21)
    at async DevServer.renderToResponseWithComponentsImpl (node_modules\next\src\server\base-server.ts:3039:23)
    at async DevServer.renderPageComponent (node_modules\next\src\server\base-server.ts:3597:15)
    at async DevServer.renderToResponseImpl (node_modules\next\src\server\base-server.ts:3659:23)
    at async DevServer.pipeImpl (node_modules\next\src\server\base-server.ts:1698:20)
    at async NextNodeServer.handleCatchallRenderRequest (node_modules\next\src\server\next-server.ts:1034:6)
    at async DevServer.handleRequestImpl (node_modules\next\src\server\base-server.ts:1462:8)
    at async (node_modules\next\src\server\dev\next-dev-server.ts:514:13)
    at async Span.traceAsyncFn (node_modules\next\src\trace\trace.ts:143:13)
    at async DevServer.handleRequest (node_modules\next\src\server\dev\next-dev-server.ts:512:19)
    at async invokeRender (node_modules\next\src\server\lib\router-server.ts:284:10)
    at async handleRequest (node_modules\next\src\server\lib\router-server.ts:530:15)
    at async requestHandlerImpl (node_modules\next\src\server\lib\router-server.ts:576:6)
    at async Server.requestListener (node_modules\next\src\server\lib\start-server.ts:146:6)
  139 |         shows: true,
  140 |       },
> 141 |     }).catch(error => console.log(error));
      |                              ^
  142 |
  143 |     return new Response("Success!", { status: 200 })
  144 |   } catch (error) { {
  code: 'ERR_INVALID_ARG_TYPE'
}
 ⨯ app\actions.ts (146:11) @ deleteHost
 ⨯ Error: Failed to delete host.
    at deleteHost (./app/actions.ts:158:15)
digest: "619090243"
  144 |   } catch (error) {
  145 |     console.error("Error deleting host:", error);
> 146 |     throw new Error("Failed to delete host.");
      |           ^
  147 |   }
  148 | }
  149 |

Here is my schema.prisma:

generator client {
  provider        = "prisma-client-js"
  previewFeatures = ["driverAdapters"]
}

datasource db {
  provider = "sqlite"
  url      = "file:./dev.db"
}

model Show {
  id        String   @id @default(cuid())
  name      String
  startTime DateTime
  endTime   DateTime
  createdAt DateTime @default(now())
  updatedAt DateTime @updatedAt
  hostId    String
  host      Host     @relation(fields: [hostId], references: [id], onDelete: Cascade)

  @@index([hostId], map: "Show_hostId_fkey")
}

model Host {
  id        String   @id @default(cuid())
  name      String
  imageUrl  String?
  createdAt DateTime @default(now())
  updatedAt DateTime @updatedAt
  shows     Show[]
}

generator client {
  provider        = "prisma-client-js"
  previewFeatures = ["driverAdapters"]
}

datasource db {
  provider = "sqlite"
  url      = "file:./dev.db"
}

model Show {
  id        String   @id @default(cuid())
  name      String
  startTime DateTime
  endTime   DateTime
  createdAt DateTime @default(now())
  updatedAt DateTime @updatedAt
  hostId    String
  host      Host     @relation(fields: [hostId], references: [id], onDelete: Cascade)

  @@index([hostId], map: "Show_hostId_fkey")
}

model Host {
  id        String   @id @default(cuid())
  name      String
  imageUrl  String?
  createdAt DateTime @default(now())
  updatedAt DateTime @updatedAt
  shows     Show[]
}

I can confirm all the relevant variables are correct. In any other query I run, for example, creating hosts, creating shows, deleting shows, you name it - Anything where a 'create', 'update', or 'delete', is going down - This error occurs. I AM using Turso! Maybe there is something not supported? Here is my prisma.ts:

import { PrismaClient } from '@prisma/client'
import { PrismaLibSQL } from '@prisma/adapter-libsql'
import { createClient } from '@libsql/client'

const libsql = createClient({
  url: `${process.env.TURSO_DATABASE_URL}`,
  authToken: `${process.env.TURSO_AUTH_TOKEN}`,
})

const adapter = new PrismaLibSQL(libsql)
const prisma = new PrismaClient({ adapter }).$extends({
  query: {
    $allModels: {
      async $allOperations({ operation, model, args, query }) {
        const result = await query(args)
        
        if (['create', 'update', 'delete'].includes(operation)) {
          await libsql.sync()
        }
        
        return result
      }
    }
  }
})

export default prisma

import { PrismaClient } from '@prisma/client'
import { PrismaLibSQL } from '@prisma/adapter-libsql'
import { createClient } from '@libsql/client'

const libsql = createClient({
  url: `${process.env.TURSO_DATABASE_URL}`,
  authToken: `${process.env.TURSO_AUTH_TOKEN}`,
})

const adapter = new PrismaLibSQL(libsql)
const prisma = new PrismaClient({ adapter }).$extends({
  query: {
    $allModels: {
      async $allOperations({ operation, model, args, query }) {
        const result = await query(args)
        
        if (['create', 'update', 'delete'].includes(operation)) {
          await libsql.sync()
        }
        
        return result
      }
    }
  }
})

export default prisma

Interestingly, when removing everything after $extends... It is fixed... May be a Turso issue. No clue.,

Petr Bela•2w ago

I'm not sure if it's "only" Next.js 15 issue but on my project I just downgraded to Next.js 14 without making any other change and the error now displays correctly. With Next.js 15 I get the generic "payload argument" error. It seems it only happens with Next.js 15 and some combination of transpiling or client extensions.

Gaming

Programming

TypeError: The "payload" argument must be of type object. Received null

Did you find this page helpful?