Stripe webhook signature verification failed in Next.js: causes and fix

No signatures found matching the expected signature for payload.
Are you passing the raw request body you received from Stripe?

import Stripe from "stripe";

const stripe = new Stripe(process.env.STRIPE_SECRET_KEY!);
const endpointSecret = process.env.STRIPE_WEBHOOK_SECRET!;

export async function POST(req: Request) {
  const signature = req.headers.get("stripe-signature");
  if (!signature) {
    return new Response("Missing stripe-signature header", { status: 400 });
  }

  // The raw text, exactly as Stripe sent it. Never call req.json() before
  // verifying: the signature covers the original bytes.
  const body = await req.text();

  let event: Stripe.Event;
  try {
    event = stripe.webhooks.constructEvent(body, signature, endpointSecret);
  } catch (err) {
    console.error("Webhook verification failed:", (err as Error).message);
    return new Response("Invalid signature", { status: 400 });
  }

  switch (event.type) {
    case "checkout.session.completed":
      // Grant access, store the customer ID, and so on.
      console.log("paid:", event.data.object.id);
      break;
    default:
      // Ignore events you did not ask for. Still answer 200.
      break;
  }

  return new Response("ok", { status: 200 });
}

event = await stripe.webhooks.constructEventAsync(
  body,
  signature,
  endpointSecret,
  undefined,
  Stripe.createSubtleCryptoProvider(),
);

import Stripe from "stripe";

const stripe = new Stripe(process.env.STRIPE_SECRET_KEY!);
const endpointSecret = process.env.STRIPE_WEBHOOK_SECRET!;

// The common mistake: parse the body, then try to verify a re-serialized copy.
export async function POST(req: Request) {
  const signature = req.headers.get("stripe-signature")!;
  const parsed = await req.json();
  const body = JSON.stringify(parsed);

  try {
    stripe.webhooks.constructEvent(body, signature, endpointSecret);
  } catch (err) {
    console.error("Webhook verification failed:", (err as Error).message);
    return new Response("Invalid signature", { status: 400 });
  }
  return new Response("ok", { status: 200 });
}

// Exercises the route handlers with real signed requests, no Stripe account needed.
process.env.STRIPE_SECRET_KEY = "sk_test_dummy";
process.env.STRIPE_WEBHOOK_SECRET = "whsec_test_secret";

import Stripe from "stripe";

const { POST: good } = await import("./route.ts");
const { POST: broken } = await import("./route-broken.ts");

const stripe = new Stripe("sk_test_dummy");
const secret = process.env.STRIPE_WEBHOOK_SECRET!;

const event = {
  id: "evt_test_1",
  object: "event",
  type: "checkout.session.completed",
  data: { object: { id: "cs_test_123", object: "checkout.session", amount_total: 4900 } },
};
// Stripe sends pretty-printed JSON. This is the exact text that gets signed.
const payload = JSON.stringify(event, null, 2);

function request(body: string, header: string | null) {
  const headers: Record<string, string> = { "content-type": "application/json" };
  if (header) headers["stripe-signature"] = header;
  return new Request("http://localhost/api/webhooks/stripe", { method: "POST", headers, body });
}

const errors: string[] = [];
const realError = console.error;
console.error = (...args: unknown[]) => errors.push(args.slice(1).join(" "));

async function run(label: string, handler: (r: Request) => Promise<Response>, body: string, header: string | null) {
  errors.length = 0;
  const res = await handler(request(body, header));
  const reason = errors[0] ? `  <- ${errors[0]}` : "";
  realError(`${String(res.status).padEnd(4)} ${label}${reason}`);
}

const signed = stripe.webhooks.generateTestHeaderString({ payload, secret });

await run("correct: raw body, right secret", good, payload, signed);
await run("broken: req.json() then JSON.stringify", broken, payload, signed);
await run("correct code, wrong secret", good, payload, stripe.webhooks.generateTestHeaderString({ payload, secret: "whsec_other" }));
await run("body changed (trailing newline added)", good, payload + "\n", signed);
await run(
  "signed 10 minutes ago",
  good,
  payload,
  stripe.webhooks.generateTestHeaderString({ payload, secret, timestamp: Math.floor(Date.now() / 1000) - 600 }),
);
await run("no stripe-signature header", good, payload, null);

// The async variant uses Web Crypto, for edge runtimes and Workers.
const event2 = await stripe.webhooks.constructEventAsync(payload, signed, secret, undefined, Stripe.createSubtleCryptoProvider());
realError(`ok   constructEventAsync + SubtleCryptoProvider -> ${event2.type}`);

npm install stripe
npx tsx test.ts

200  correct: raw body, right secret
400  broken: req.json() then JSON.stringify   <- No signatures found matching the expected signature for payload
400  correct code, wrong secret               <- No signatures found matching the expected signature for payload
400  body changed (trailing newline added)    <- No signatures found matching the expected signature for payload
400  signed 10 minutes ago                    <- Timestamp outside the tolerance zone
400  no stripe-signature header
ok   constructEventAsync + SubtleCryptoProvider -> checkout.session.completed