feat: middleware

Author: ImLunaHey

package-lock.json

@@ -18,7 +18,8 @@
     "prepare": "npm run build",
     "format": "prettier --write src/*.ts tests/*.ts",
     "check-format": "prettier -c src/*.ts tests/*.ts",
-    "test": "vitest run tests --coverage"
+    "test": "vitest run tests --coverage",
+    "test:watch": "vitest tests --coverage --ui"
   },
   "repository": {
     "type": "git",
@@ -49,7 +50,7 @@
     "vitest": "^2.1.5"
   },
   "dependencies": {
-    "whatwg-fetch": "^3.6.2",
-    "use-deep-compare": "^1.2.1"
+    "use-deep-compare": "^1.2.1",
+    "whatwg-fetch": "^3.6.2"
   }
 }

package.json

@@ -1,5 +1,6 @@
 export { log, Logger, LogLevel, type LoggerConfig, type RequestReport } from './logger';
 export { EndpointType, throttle } from './shared';
+export { middleware, config } from './middleware';
 export * from './platform/base';
 export * from './config';
 export { withAxiom, type AxiomRequest, withAxiomNextConfig, withAxiomRouteHandler } from './withAxiom';

src/index.ts

@@ -0,0 +1,52 @@
+import { NextResponse } from 'next/server';
+import type { NextFetchEvent, NextRequest } from 'next/server';
+import { config as axiomConfig } from './config';
+import { EndpointType } from './shared';
+
+const webVitalsEndpoint = axiomConfig.getIngestURL(EndpointType.webVitals);
+const logsEndpoint = axiomConfig.getIngestURL(EndpointType.logs);
+
+const headers = {
+  authorization: 'Bearer ' + axiomConfig.token,
+  'Content-Type': 'application/json',
+};
+
+export async function middleware(request: NextRequest, event: NextFetchEvent): Promise<NextResponse<unknown> | void> {
+  // If the request is not for axiom, do nothing
+  // This is a safety check, as users may add a custom matcher
+  if (!request.nextUrl.pathname.startsWith('/_axiom')) return;
+
+  // Web vitals
+  if (request.nextUrl.pathname.startsWith('/_axiom/web-vitals')) {
+    // Forward the request to the axiom ingest endpoint
+    event.waitUntil(
+      fetch(webVitalsEndpoint, {
+        body: request.body,
+        method: 'POST',
+        headers,
+      }).catch(console.error)
+    );
+
+    // Return a 204 to the client
+    return new NextResponse(null, { status: 204 });
+  }
+
+  // Logs
+  if (request.nextUrl.pathname.startsWith('/_axiom/logs')) {
+    // Forward the request to the axiom ingest endpoint
+    event.waitUntil(
+      fetch(logsEndpoint, {
+        body: request.body,
+        method: 'POST',
+        headers,
+      }).catch(console.error)
+    );
+
+    // Return a 204 to the client
+    return new NextResponse(null, { status: 204 });
+  }
+}
+
+export const config = {
+  matcher: '/_axiom/:path*',
+};

src/middleware.ts

@@ -1,8 +1,8 @@
-import { GetServerSidePropsContext, NextApiRequest } from "next";
-import { LogEvent } from "../logger";
-import { EndpointType } from "../shared";
-import type Provider from "./base";
-import { isBrowser, isVercel } from "../config";
+import { GetServerSidePropsContext, NextApiRequest } from 'next';
+import { LogEvent } from '../logger';
+import { EndpointType } from '../shared';
+import type Provider from './base';
+import { isBrowser, isVercel } from '../config';
 
 // This is the generic config class for all platforms that doesn't have a special
 // implementation (e.g: vercel, netlify). All config classes extends this one.
@@ -17,6 +17,10 @@ export default class GenericConfig implements Provider {
   customEndpoint: string | undefined = process.env.NEXT_PUBLIC_AXIOM_CUSTOM_ENDPOINT;
 
   isEnvVarsSet(): boolean {
+    if (isBrowser) {
+      return !!(this.axiomUrl && this.dataset) || !!this.customEndpoint;
+    }
+
     return !!(this.axiomUrl && this.dataset && this.token) || !!this.customEndpoint;
   }
 
@@ -41,21 +45,21 @@ export default class GenericConfig implements Provider {
   }
 
   wrapWebVitalsObject(metrics: any[]): any {
-    return metrics.map(m => ({
+    return metrics.map((m) => ({
       webVital: m,
       _time: new Date().getTime(),
       platform: {
         environment: this.environment,
         source: 'web-vital',
       },
-      source: 'web-vital'
-    }))
+      source: 'web-vital',
+    }));
   }
 
   injectPlatformMetadata(logEvent: LogEvent, source: string) {
-    let key: "platform" | "vercel" | "netlify" = "platform"
+    let key: 'platform' | 'vercel' | 'netlify' = 'platform';
     if (isVercel) {
-      key = "vercel"
+      key = 'vercel';
     }
 
     logEvent.source = source;
@@ -74,7 +78,7 @@ export default class GenericConfig implements Provider {
         commit: process.env.NEXT_PUBLIC_VERCEL_GIT_COMMIT_SHA,
         repo: process.env.NEXT_PUBLIC_VERCEL_GIT_REPO_SLUG,
         ref: process.env.NEXT_PUBLIC_VERCEL_GIT_COMMIT_REF,
-      }
+      };
     }
   }