+ How it works +
+
+ This site demonstrates how to proxy analytics through Vercel using vercel.ts for first-party data collection.
+
+ First-party analytics proxy +
++ By proxying PostHog requests through your own domain, analytics data is collected as first-party traffic. This improves data accuracy and ensures consistent tracking across all users. +
+{`import { routes } from '@vercel/config/v1'
+
+export const config = {
+ routes: [
+ routes.rewrite('/ph/static/(.*)',
+ 'https://us-assets.i.posthog.com/static/$1',
+ { requestHeaders: { 'host': 'us-assets.i.posthog.com' } }
+ ),
+ routes.rewrite('/ph/(.*)',
+ 'https://us.i.posthog.com/$1',
+ { requestHeaders: { 'host': 'us.i.posthog.com' } }
+ ),
+ ],
+}`}
+ + How the proxy works +
+Route configuration
+
+ The vercel.ts file defines rewrite rules that map /ph/* paths to PostHog's servers.
+
Header rewriting
+
+ The host header is rewritten so PostHog's servers correctly route the proxied requests.
+
Client initialization
+
+ PostHog is initialized with api_host: '/ph' to send all requests through your proxy endpoint.
+
+ Benefits +
+-
+
- + + + Better data accuracy — First-party requests aren't subject to the same restrictions as third-party tracking + + +
- + + + No edge function costs — Uses Vercel's built-in reverse proxy layer + + +
- + + + Framework agnostic — Works with Next.js, Vue, Astro, or any framework + + +
- + + + Simple setup — Just configure routes and set your API key + + +
+ Try it yourself +
+
+ Open your browser's Network tab and look for requests to /ph/. You'll see analytics calls going through your domain instead of directly to PostHog.
+