Randomize PostHog proxy path per build (#528)

Author: RhysSullivan

apps/cloud/src/routes/__root.tsx

@@ -26,8 +26,14 @@ if (typeof window !== "undefined" && import.meta.env.VITE_PUBLIC_SENTRY_DSN) {
 }
 
 if (typeof window !== "undefined" && import.meta.env.VITE_PUBLIC_POSTHOG_KEY) {
+  const analyticsPath = (import.meta.env.VITE_PUBLIC_ANALYTICS_PATH ?? "a").replace(
+    /^\/+|\/+$/g,
+    "",
+  );
+
   posthog.init(import.meta.env.VITE_PUBLIC_POSTHOG_KEY, {
-    api_host: import.meta.env.VITE_PUBLIC_POSTHOG_HOST ?? `${window.location.origin}/ingest`,
+    api_host:
+      import.meta.env.VITE_PUBLIC_POSTHOG_HOST ?? `${window.location.origin}/api/${analyticsPath}`,
     ui_host: "https://us.posthog.com",
     defaults: "2025-05-24",
     person_profiles: "identified_only",

apps/cloud/src/start.ts

@@ -106,28 +106,32 @@ const sentryTunnelMiddleware = createMiddleware({ type: "request" }).server(
 );
 
 // ---------------------------------------------------------------------------
-// PostHog reverse proxy — the browser SDK targets `/ingest/*` (configured in
-// routes/__root.tsx) and we forward to PostHog's ingest + asset hosts. Keeps
+// PostHog reverse proxy — the browser SDK targets a build-randomized
+// first-party path and we forward to PostHog's ingest + asset hosts. Keeps
 // events flowing past adblockers that match *.posthog.com. See
 // https://posthog.com/docs/advanced/proxy/cloudflare
 // ---------------------------------------------------------------------------
 
 const POSTHOG_INGEST_HOST = "us.i.posthog.com";
 const POSTHOG_ASSETS_HOST = "us-assets.i.posthog.com";
+const POSTHOG_PROXY_PATH = `/api/${(import.meta.env.VITE_PUBLIC_ANALYTICS_PATH ?? "a").replace(
+  /^\/+|\/+$/g,
+  "",
+)}`;
 
 const posthogProxyMiddleware = createMiddleware({ type: "request" }).server(
   ({ pathname, request, next }) => {
-    if (pathname !== "/ingest" && !pathname.startsWith("/ingest/")) {
+    if (pathname !== POSTHOG_PROXY_PATH && !pathname.startsWith(`${POSTHOG_PROXY_PATH}/`)) {
       return next();
     }
 
     const url = new URL(request.url);
-    url.hostname = pathname.startsWith("/ingest/static/")
+    url.hostname = pathname.startsWith(`${POSTHOG_PROXY_PATH}/static/`)
       ? POSTHOG_ASSETS_HOST
       : POSTHOG_INGEST_HOST;
     url.protocol = "https:";
     url.port = "";
-    url.pathname = pathname.replace(/^\/ingest/, "") || "/";
+    url.pathname = pathname.slice(POSTHOG_PROXY_PATH.length) || "/";
 
     const upstream = new Request(url, request);
     upstream.headers.delete("cookie");

apps/cloud/vite.config.ts

@@ -1,3 +1,4 @@
+import { randomUUID } from "node:crypto";
 import { fileURLToPath } from "node:url";
 import { defineConfig, loadEnv, type Plugin } from "vite";
 import { cloudflare } from "@cloudflare/vite-plugin";
@@ -44,9 +45,19 @@ const loadWranglerPublicVars = () => {
   );
 };
 
+let generatedAnalyticsPath: string | undefined;
+const getGeneratedAnalyticsPath = () => {
+  generatedAnalyticsPath ??= randomUUID().slice(0, 8);
+  return generatedAnalyticsPath;
+};
+
 export default defineConfig(({ mode }) => {
   const env = loadEnv(mode, process.cwd(), "");
-  const publicEnv = { ...loadWranglerPublicVars(), ...env };
+  const publicEnv = {
+    ...loadWranglerPublicVars(),
+    VITE_PUBLIC_ANALYTICS_PATH: getGeneratedAnalyticsPath(),
+    ...env,
+  };
 
   return {
     define: Object.fromEntries(