Pass visitor auth token to site insights events (#2662)

Author: SamyPesse

packages/gitbook/src/components/Insights/InsightsProvider.tsx

@@ -64,14 +64,15 @@ const InsightsContext = React.createContext<TrackEventCallback>(() => {});
 interface InsightsProviderProps extends InsightsEventContext {
     enabled: boolean;
     apiHost: string;
+    visitorAuthToken: string | null;
     children: React.ReactNode;
 }
 
 /**
  * Wrap the content of the app with the InsightsProvider to track events.
  */
 export function InsightsProvider(props: InsightsProviderProps) {
-    const { enabled, apiHost, children, ...context } = props;
+    const { enabled, apiHost, visitorAuthToken, children, ...context } = props;
 
     const visitorIdRef = React.useRef<string | null>(null);
     const eventsRef = React.useRef<{
@@ -124,6 +125,7 @@ export function InsightsProvider(props: InsightsProviderProps) {
                     pageContext: eventsForPathname.pageContext,
                     visitorId,
                     sessionId: session.id,
+                    visitorAuthToken,
                 }),
             );
 
@@ -255,6 +257,7 @@ function transformEvents(input: {
     pageContext: InsightsEventPageContext;
     visitorId: string;
     sessionId: string;
+    visitorAuthToken: string | null;
 }): api.SiteInsightsEvent[] {
     const session: api.SiteInsightsEventSession = {
         sessionId: input.sessionId,
@@ -263,6 +266,7 @@ function transformEvents(input: {
         language: window.navigator.language,
         cookies: cookies.get(),
         referrer: document.referrer || null,
+        visitorAuthToken: input.visitorAuthToken ?? null,
     };
 
     const location: api.SiteInsightsEventLocation = {

packages/gitbook/src/components/SpaceLayout/SpaceLayout.tsx

@@ -13,13 +13,13 @@ import React from 'react';
 import { Footer } from '@/components/Footer';
 import { CompactHeader, Header } from '@/components/Header';
 import { CONTAINER_STYLE } from '@/components/layout';
-import { ColorDebugger } from '@/components/primitives/ColorDebugger';
 import { SearchModal } from '@/components/Search';
 import { TableOfContents } from '@/components/TableOfContents';
 import { api, ContentTarget, type SectionsList, SiteContentPointer } from '@/lib/api';
 import { ContentRefContext } from '@/lib/references';
 import { tcls } from '@/lib/tailwind';
 import { shouldTrackEvents } from '@/lib/tracking';
+import { getCurrentVisitorToken } from '@/lib/visitor-token';
 
 import { SpacesDropdown } from '../Header/SpacesDropdown';
 import { InsightsProvider } from '../Insights';
@@ -69,6 +69,7 @@ export function SpaceLayout(props: {
         <InsightsProvider
             enabled={shouldTrackEvents()}
             apiHost={api().client.endpoint}
+            visitorAuthToken={getCurrentVisitorToken()}
             {...content}
         >
             {/* <ColorDebugger /> */}

packages/gitbook/src/lib/visitor-token.ts

@@ -1,3 +1,4 @@
+import { headers } from 'next/headers';
 import type { NextRequest } from 'next/server';
 import hash from 'object-hash';
 
@@ -89,6 +90,14 @@ export function normalizeVisitorAuthURL(url: URL): URL {
     return withoutVAParam;
 }
 
+/**
+ * Get the visitor token from the request context.
+ */
+export function getCurrentVisitorToken(): string | null {
+    const visitorToken = headers().get('x-gitbook-visitor-token');
+    return visitorToken;
+}
+
 /**
  * Get all possible basePaths for a given URL. This is used to find the visitor
  * authentication cookie token.

packages/gitbook/src/middleware.ts

@@ -80,6 +80,8 @@ export type LookupResult = PublishedContentWithCache & {
     apiEndpoint?: string;
     /** Cookies to store on the response */
     cookies?: LookupCookies;
+    /** Visitor authentication token */
+    visitorToken?: string;
 };
 
 /**
@@ -269,6 +271,10 @@ export async function middleware(request: NextRequest) {
         headers.set('x-gitbook-api', apiEndpoint);
     }
 
+    if (resolved.visitorToken) {
+        headers.set('x-gitbook-visitor-token', resolved.visitorToken);
+    }
+
     const target = new URL(rewritePathname, request.nextUrl.toString());
     target.search = url.search;
 
@@ -300,7 +306,6 @@ export async function middleware(request: NextRequest) {
             setMiddlewareHeader(response, 'x-gitbook-cache-control', cacheControl);
         }
     }
-    // }
 
     if (resolved.cacheTags && resolved.cacheTags.length > 0) {
         const headerCacheTag = resolved.cacheTags.join(',');
@@ -407,6 +412,7 @@ async function lookupSiteInSingleMode(url: URL): Promise<LookupResult> {
         basePath: '',
         pathname: url.pathname,
         apiToken,
+        visitorToken: undefined,
     };
 }
 
@@ -440,6 +446,7 @@ async function lookupSiteInMultiMode(request: NextRequest, url: URL): Promise<Lo
         ...('basePath' in lookup && visitorAuthToken
             ? getLookupResultForVisitorAuth(lookup.basePath, visitorAuthToken)
             : {}),
+        visitorToken: visitorAuthToken?.token,
     };
 }
 
@@ -667,6 +674,7 @@ async function lookupSiteInMultiPathMode(request: NextRequest, url: URL): Promis
         ...('basePath' in lookup && visitorAuthToken
             ? getLookupResultForVisitorAuth(lookup.basePath, visitorAuthToken)
             : {}),
+        visitorToken: visitorAuthToken?.token,
     };
 }