Skip to main content

appRouterWebhook()

Simplifies the process of setting up a Lambda Webhook in your Next.js app which is using App Router. Refer to pagesRouterWebhook() for doing the same in apps using Pages Router.

API​

The function accepts an object with six key-value pairs:

secret​

Your webhook secret, must be a string

testing​

Whether or not to allow requests intending to test the endpoint, useful while using Webhook endpoint tester on Webhooks Page. Should be a boolean.

extraHeaders​

Add your own custom headers to the outgoing response. Provide key-value pairs where both the key and value are strings.

onSuccess()​

A function that is called with a WebhookSuccessPayload object as an argument when the incoming request indicates a successful event.

onError()​

A function that is called with a WebhookErrorPayload object as an argument when the incoming request indicates an error.

onTimeout()​

A function that is called with a WebhookTimeoutPayload object as an argument when the incoming request indicates a timeout.

Example​

Setting up a webhook endpoint in a Next.js app which uses App Router. This will listen on the endpoint: mydomain.com/api

app/api/route.ts
tsx
import {appRouterWebhook} from '@remotion/lambda/client';
 
export const POST = appRouterWebhook({
  secret: 'mysecret',
  testing: true,
  extraHeaders: {
    region: 'south-asia',
  },
  onSuccess: () => console.log('Rendering Completed Successfully'),
  onError: () => console.log('Something went wrong while rendering'),
  onTimeout: () => console.log('Timeout occured while rendering'),
});
 
export const OPTIONS = POST;
app/api/route.ts
tsx
import {appRouterWebhook} from '@remotion/lambda/client';
 
export const POST = appRouterWebhook({
  secret: 'mysecret',
  testing: true,
  extraHeaders: {
    region: 'south-asia',
  },
  onSuccess: () => console.log('Rendering Completed Successfully'),
  onError: () => console.log('Something went wrong while rendering'),
  onTimeout: () => console.log('Timeout occured while rendering'),
});
 
export const OPTIONS = POST;

See Webhooks for an Express example.

See also​