diff --git a/apps/docs/src/pages/docs/nextjs.mdx b/apps/docs/src/pages/docs/nextjs.mdx index 3b38acc2..1e1682c6 100644 --- a/apps/docs/src/pages/docs/nextjs.mdx +++ b/apps/docs/src/pages/docs/nextjs.mdx @@ -189,9 +189,9 @@ clear(); If you want to track server-side events, you should create an instance of our Javascript SDK. It's exported from `@openpanel/nextjs` -When using server events it's important to create a new client (with a secret). Since it's backend we cannot authorize the request with cors headers. +When using server events it's important that you use a secret to authenticate the request. This is to prevent unauthorized requests since we cannot use cors headers. -`Openpanel Dashboard -> Setting -> Clients -> Create client` +You can use the same clientId but you should pass the associated client secret to the SDK. @@ -214,6 +214,7 @@ opServer.event('my_server_event', { profileId: '123', ok: '✅' }); With `createNextRouteHandler` you can proxy your events through your server, this will ensure all events are tracked since there is a lot of adblockers that block requests to third party domains. ```typescript +// file: /app/api/op/[...op]/route.ts import { createNextRouteHandler } from '@openpanel/nextjs'; export const { POST } = createNextRouteHandler({ @@ -221,3 +222,13 @@ export const { POST } = createNextRouteHandler({ clientSecret: '{YOUR_CLIENT_SECRET}', }); ``` + +Remember to change the `url` in the `OpenpanelProvider` to your own server. + +```tsx + +```