Next.js Integration

Next.js Outbound API Monitoring

Track every API call from Server Components, API Routes, and Server Actions. Works on Vercel, self-hosted, and everywhere Next.js runs.

Get started in seconds:

npm install @outboundiq/nextjs
Works perfectly on Vercel - Serverless & Edge compatible

Three Simple Steps

Use Next.js instrumentation for automatic tracking in Server Components

1️⃣

Create instrumentation.ts

export async function register() {
  if (process.env.NEXT_RUNTIME === 'nodejs') {
    await import('@outboundiq/nextjs/register');
  }
}
2️⃣

Enable in next.config.js

module.exports = {
  experimental: {
    instrumentationHook: true,
  },
};
3️⃣

Add API Key

# .env
OUTBOUNDIQ_KEY=your_key

Full Next.js Coverage

Server Components

Fetch calls in Server Components are automatically tracked via instrumentation.

// app/page.tsx
export default async function Page() {
  // Automatically tracked!
  const data = await fetch('https://api.example.com');
  return <div>{JSON.stringify(await data.json())}</div>;
}

API Routes

Use trackFetch for explicit tracking in route handlers.

// app/api/data/route.ts
import { trackFetch } from '@outboundiq/nextjs';

export async function GET() {
  const data = await trackFetch('https://api.example.com');
  return Response.json(data);
}

Server Actions

Server Actions that make API calls are automatically tracked.

// app/actions.ts
'use server'

export async function submitForm(data) {
  // Automatically tracked!
  await fetch('https://api.example.com/submit', {
    method: 'POST',
    body: JSON.stringify(data)
  });
}

User Context

Track which user made each API call with middleware integration.

// middleware.ts
import { withOutboundIQ } from '@outboundiq/nextjs/middleware';

export default withOutboundIQ(async (req) => {
  return NextResponse.next();
}, {
  getUserContext: async (req) => {
    const token = await getToken({ req });
    return { userId: token?.sub };
  },
});

Optimized for Vercel

Works seamlessly with Vercel's serverless and edge infrastructure

Serverless Functions ✓

Standard API routes and Server Components run in Node.js runtime. Automatic tracking via instrumentation.ts.

Edge Functions ✓

Edge routes work with trackFetch(). Middleware tracking supported with our edge-compatible wrapper.

Test Your Integration

Verify everything is working with a single command

npx outboundiq-test

Start Monitoring Your Next.js APIs Today

Free tier available. No credit card required.