Using Nuxt routeRules as a reverse proxy

Last updated:

|
Warning

  1. The following self-hosted proxy isn't provided by PostHog, so we can't take responsibility for it! If unsure, we recommend using our managed reverse proxy.

  2. If you are using the EU cloud then use eu instead of us in all domains (e.g. us.i.posthog.com -> eu.i.posthog.com).

  3. Avoid using generic or common path names like /analytics, /tracking, /ingest, or /posthog for your reverse proxy. They will most likely be blocked. Instead, use a non-obvious path name or something random and unique to your application that's unlikely to appear in a filter list.

Nuxt 3 uses Nitro under the hood, which provides the routeRules config that can be used to proxy requests from one route to another.

To do this, add the following routeRules to your nuxt.config.ts file:

JavaScript
// nuxt.config.ts
export default defineNuxtConfig({
    routeRules: {
        '/<ph_proxy_path>/static/**': { proxy: 'https://us-assets.i.posthog.com/static/**' },
        '/<ph_proxy_path>/**': { proxy: 'https://us.i.posthog.com/**' },
    },
});

Then configure the PostHog client to send requests via your new proxy:

JavaScript
const posthogClient = posthog.init(runtimeConfig.public.posthogPublicKey, {
    api_host: 'https://your-host.com/<ph_proxy_path>',
    ui_host: '<ph_app_host>',
});

Questions? Ask Max AI.

It's easier than reading through 798 pages of documentation

Community questions

Was this page useful?

Next article

Using Pomerium as a reverse proxy

Pomerium is an identity-aware proxy that can be used to securely proxy traffic to PostHog. This guide will show you how to configure Pomerium as a reverse proxy for PostHog. Set up with Pomerium Zero The assumption is you've already set up Pomerium Zero . 1. Create an Optional Allow All Policy Log in to Pomerium Zero . Click on Manage -> Policies in the side bar. Click the New Policy button to create a new policy. Name the policy allow all or something similar. Set the Policy Enforcement…

Read next article