feat: 补 /docs 页面自家 analytics page_view 埋点

longsizhuo · longsizhuo · commit 5f5e2ba059b4 · 2026-04-14T18:01:57.000Z
- 新增 DocsPageViewTracker 客户端组件，usePathname+useEffect 监听路由
- sessionStorage 去重，同一会话同一 path 不重复上报
- POST /api/analytics，携带 x-satoken（有 token 时），匿名用户 userId 由后端解析为 null
- 在 app/docs/layout.tsx 中挂载
diff --git a/app/components/DocsPageViewTracker.tsx b/app/components/DocsPageViewTracker.tsx
@@ -0,0 +1,35 @@
+"use client";
+
+import { usePathname } from "next/navigation";
+import { useEffect } from "react";
+
+export function DocsPageViewTracker() {
+  const pathname = usePathname();
+
+  useEffect(() => {
+    if (!pathname) return;
+
+    const key = `pv_reported:${pathname}`;
+    if (sessionStorage.getItem(key)) return;
+
+    sessionStorage.setItem(key, "1");
+
+    const token =
+      typeof window !== "undefined" ? localStorage.getItem("satoken") : null;
+    const headers: Record<string, string> = {
+      "Content-Type": "application/json",
+    };
+    if (token) headers["x-satoken"] = token;
+
+    fetch("/api/analytics", {
+      method: "POST",
+      headers,
+      body: JSON.stringify({
+        eventType: "page_view",
+        eventData: { path: pathname, title: document.title },
+      }),
+    }).catch(() => {});
+  }, [pathname]);
+
+  return null;
+}
diff --git a/app/docs/layout.tsx b/app/docs/layout.tsx
@@ -5,6 +5,7 @@ import type { ReactNode } from "react";
 import { DocsRouteFlag } from "@/app/components/RouteFlags";
 import type { PageTree } from "fumadocs-core/server";
 import { CopyTracking } from "@/app/components/CopyTracking";
+import { DocsPageViewTracker } from "@/app/components/DocsPageViewTracker";
 
 function pruneEmptyFolders(root: PageTree.Root): PageTree.Root {
   const transformNode = (node: PageTree.Node): PageTree.Node | null => {
@@ -71,6 +72,7 @@ export default async function Layout({ children }: { children: ReactNode }) {
       {/* Add a class on <html> while in docs to adjust global backgrounds */}
       <CopyTracking />
       <DocsRouteFlag />
+      <DocsPageViewTracker />
       <DocsLayout
         tree={tree}
         {...options}
