Skip to main content
All recipes

Next.js.

CodeApp RouterPages Router

Initialize CheckUpstream once in `instrumentation.ts` and every server-side fetch — API routes, Server Components, Route Handlers, middleware — gets tracked automatically. Use Next.js' `after()` to flush telemetry without delaying the response.

1. Install.

Bash
npm install @checkupstream/sdk

2. Register the instrumentation hook.

Re-export `register` from the Next.js integration. The SDK reads `CHECKUPSTREAM_SDK_KEY` from your environment — no code-side configuration required.

instrumentation.ts
export { register } from "@checkupstream/sdk/integrations/next";

Need explicit config?.

Use `initCheckUpstream` instead and pass the same options the GA Node.js SDK accepts.

instrumentation.ts
import { initCheckUpstream } from "@checkupstream/sdk/integrations/next";

export function register() {
  initCheckUpstream({
    sdkKey: process.env.CHECKUPSTREAM_SDK_KEY!,
    environment: process.env.VERCEL_ENV ?? "development",
    services: ["api.stripe.com", "api.openai.com"],
  });
}

3. Flush before the function shuts down.

Serverless runtimes can freeze a request as soon as the response ships. `after()` runs once the response is sent, so the SDK has time to drain its buffer.

app/api/users/route.ts
import { after } from "next/server";
import { flushTelemetry } from "@checkupstream/sdk/integrations/next";

export async function GET() {
  const data = await fetchUpstreamService();
  after(flushTelemetry);
  return Response.json(data);
}

Ship reliable upstream.

Drop the SDK in, point it at your project key, and start seeing live upstream telemetry inside the dashboard.