proxy nextjs events
This commit is contained in:
committed by
Carl-Gerhard Lindesvärd
parent
494044a3e2
commit
c5d7807584
@@ -208,3 +208,16 @@ opServer.event('my_server_event', { ok: '✅' });
|
|||||||
// Pass `profileId` to track events for a specific user
|
// Pass `profileId` to track events for a specific user
|
||||||
opServer.event('my_server_event', { profileId: '123', ok: '✅' });
|
opServer.event('my_server_event', { profileId: '123', ok: '✅' });
|
||||||
```
|
```
|
||||||
|
|
||||||
|
### Proxy events
|
||||||
|
|
||||||
|
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
|
||||||
|
import { createNextRouteHandler } from '@openpanel/nextjs';
|
||||||
|
|
||||||
|
export const { POST } = createNextRouteHandler({
|
||||||
|
clientId: '{YOUR_CLIENT_ID}',
|
||||||
|
clientSecret: '{YOUR_CLIENT_SECRET}',
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|||||||
68
packages/sdks/nextjs/createNextRouteHandler.ts
Normal file
68
packages/sdks/nextjs/createNextRouteHandler.ts
Normal file
@@ -0,0 +1,68 @@
|
|||||||
|
import { NextResponse } from 'next/server';
|
||||||
|
|
||||||
|
const VALID_PATHS = [
|
||||||
|
'/profile',
|
||||||
|
'/profile/increment',
|
||||||
|
'/profile/decrement',
|
||||||
|
'/event',
|
||||||
|
];
|
||||||
|
|
||||||
|
function getIp(req: Request) {
|
||||||
|
if (req.headers.get('X-Forwarded-For')) {
|
||||||
|
return req.headers.get('X-Forwarded-For')?.split(',')[0];
|
||||||
|
}
|
||||||
|
return req.headers.get('x-real-ip') ?? '0.0.0.0';
|
||||||
|
}
|
||||||
|
|
||||||
|
function getPath(params?: Record<string, unknown>) {
|
||||||
|
const segments = params?.op;
|
||||||
|
if (segments && Array.isArray(segments)) {
|
||||||
|
const path = `/${segments.join('/')}`;
|
||||||
|
if (VALID_PATHS.includes(path)) {
|
||||||
|
return path;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function createNextRouteHandler({
|
||||||
|
clientId,
|
||||||
|
clientSecret,
|
||||||
|
url = 'https://api.openpanel.dev',
|
||||||
|
}: {
|
||||||
|
clientId: string;
|
||||||
|
clientSecret: string;
|
||||||
|
url?: string;
|
||||||
|
}) {
|
||||||
|
return {
|
||||||
|
POST: async function POST(
|
||||||
|
req: Request,
|
||||||
|
{ params }: { params: Record<string, unknown> }
|
||||||
|
) {
|
||||||
|
const path = getPath(params);
|
||||||
|
if (!path) {
|
||||||
|
return NextResponse.json('Invalid path');
|
||||||
|
}
|
||||||
|
|
||||||
|
const headers = {
|
||||||
|
'user-agent': req.headers.get('user-agent')!,
|
||||||
|
'Content-Type': req.headers.get('Content-Type')!,
|
||||||
|
'openpanel-client-id': clientId,
|
||||||
|
'openpanel-client-secret': clientSecret,
|
||||||
|
'x-client-ip': getIp(req)!,
|
||||||
|
};
|
||||||
|
|
||||||
|
try {
|
||||||
|
const res = await fetch(`${url}${path}`, {
|
||||||
|
method: 'POST',
|
||||||
|
headers,
|
||||||
|
body: JSON.stringify(await req.json()),
|
||||||
|
});
|
||||||
|
return NextResponse.json(await res.text());
|
||||||
|
} catch (e) {
|
||||||
|
return NextResponse.json(e);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
};
|
||||||
|
}
|
||||||
@@ -9,6 +9,7 @@ import type {
|
|||||||
} from '@openpanel/web';
|
} from '@openpanel/web';
|
||||||
|
|
||||||
export * from '@openpanel/web';
|
export * from '@openpanel/web';
|
||||||
|
export { createNextRouteHandler } from './createNextRouteHandler';
|
||||||
|
|
||||||
const CDN_URL = 'https://openpanel.dev/op.js';
|
const CDN_URL = 'https://openpanel.dev/op.js';
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user