Update docs for next.js 13/14 route handlers.

[JonnyBurger]

From message posted on Discord by 1voy

Also, a little update to those docs with next.js 13/14 route handlers would be nice

[JonnyBurger]

Referring to https://www.remotion.dev/docs/lambda/webhooks

[JonnyBurger]

Is someone with Next.js knowledge able to help and rewrite this for the App Router?

pages/api/webhook.ts

import {
  validateWebhookSignature,
  WebhookPayload,
} from "@remotion/lambda/client";
 
// Enable testing through the tool below
const ENABLE_TESTING = true;
 
export default async function handler(
  req: NextApiRequest,
  res: NextApiResponse,
) {
  if (ENABLE_TESTING) {
    res.setHeader("Access-Control-Allow-Origin", "https://www.remotion.dev");
    res.setHeader("Access-Control-Allow-Methods", "OPTIONS,POST");
    res.setHeader(
      "Access-Control-Allow-Headers",
      "X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Content-Type, Date, X-Api-Version, X-Remotion-Status, X-Remotion-Signature, X-Remotion-Mode",
    );
  }
  if (req.method === "OPTIONS") {
    res.status(200).end();
    return;
  }
 
  validateWebhookSignature({
    secret: process.env.WEBHOOK_SECRET as string,
    body: req.body,
    signatureHeader: req.headers["x-remotion-signature"] as string,
  });
 
  // If code reaches this path, the webhook is authentic.
  const payload = req.body as WebhookPayload;
  if (payload.type === "success") {
    // ...
  } else if (payload.type === "timeout") {
    // ...
  }
 
  res.status(200).json({
    success: true,
  });
}

Don't try submit a ChatGPT solution, it is not correct!

/bounty 60

[algora-pbc]

💎 $60 bounty • Remotion

Steps to solve:

1. Get assigned: If you'd like to work on this issue, comment /attempt below to get assigned
2. Submit work: Create a pull request including /claim #3731 in the PR body to claim the bounty
3. Receive payment: 100% of the bounty is received 2-5 days post-reward. Make sure you are eligible for payouts

Thank you for contributing to remotion-dev/remotion!

Add a bounty • Share on socials

[algora-pbc]

@Idan-Garay: The Remotion team prefers to assign a single contributor to the issue rather than let anyone attempt it right away. We recommend waiting for a confirmation from a member before getting started.