Docs/Integrations

Vercel Edge Middleware

Integrate CrawlReady with Vercel Edge Middleware.

Middleware Setup

If you are using Next.js, use the Next.js integration instead — withCrawlReady from @crawlready/middleware/next already uses event.waitUntil() and is fully compatible with Vercel's Edge Runtime.

For non-Next.js projects deployed to Vercel Edge (e.g. a standalone middleware.ts with Vercel's edge functions), install the package:

npm install @crawlready/middleware
# or
pnpm add @crawlready/middleware

Create middleware.ts in your project root:

import { withCrawlReady } from '@crawlready/middleware/next';
import type { NextFetchEvent, NextRequest } from 'next/server';
import { NextResponse } from 'next/server';

export const config = {
  runtime: 'edge',
  matcher: ['/((?!_next/static|_next/image|favicon.ico).*)'],
};

const crawlreadyMiddleware = withCrawlReady({
  siteKey: process.env.CRAWLREADY_SITE_KEY!,
});

export default function middleware(req: NextRequest, event: NextFetchEvent) {
  return crawlreadyMiddleware(req, event);
}

Add your site key as a Vercel environment variable:

vercel env add CRAWLREADY_SITE_KEY

withCrawlReady uses event.waitUntil() to send the analytics beacon after the response is returned, which is the correct pattern for Vercel Edge — the function stays alive for the beacon without delaying the visitor.

For all configuration options, see Core Concepts — Middleware Configuration.

Verify Your Integration

After deploying, use the Verify Integration button in your CrawlReady dashboard. It sends a synthetic GPTBot request to your site and confirms that a visit is recorded within 15 seconds.

If the check times out:

  • Confirm middleware.ts is in your project root.
  • Confirm the environment variable is added to the correct Vercel environment (Production/Preview/Development).
  • Check your Vercel function logs for errors.

Need Help?

Can't find what you're looking for? Reach out and we'll help.

Contact us