Claude API Serverless Deployment on Vercel

Deploying Claude API calls inside Vercel's serverless functions works well, but it comes with a handful of constraints that trip people up: function execution limits, how streaming behaves across runtimes, and where to store API keys safely. This guide walks through a working setup for both the standard Node.js serverless runtime and the Edge runtime, plus the gotchas specific to running Claude behind Vercel.

The short answer to "can you run the Claude API on Vercel" is yes — you call it from an API route like any other HTTP request. The harder part is picking the right runtime for your use case (streaming chat needs the Edge runtime or a function duration override) and keeping your API key out of client-side code. The rest of this article covers both.

Choosing a Runtime: Node.js vs Edge

Vercel offers two execution environments for API routes:

• Node.js serverless functions — full Node APIs, default 10-second timeout on Hobby plans (up to 60s on Pro, 900s on Enterprise with config), good for single-shot requests.
• Edge functions — run on V8 isolates, lower cold-start latency, no hard timeout in the same way, and better suited to streaming responses token-by-token back to the browser.

If your app streams Claude's output to the UI (which most chat interfaces do), the Edge runtime is the better default. If you're doing a single request/response with no streaming — summarization, classification, structured extraction — a Node.js function is simpler and gives you access to the full fetch/axios ecosystem without edge restrictions.

Setting Up Environment Variables

Never ship an API key in client-side bundles. Store it as a Vercel environment variable and only reference it inside server-side code:

vercel env add ANTHROPIC_API_KEY

Set it for Production, Preview, and Development separately if the values differ (useful if you want a cheaper or rate-limited key for previews).

A Basic Serverless Function

Here's a Node.js API route (app/api/chat/route.js in the App Router) that calls Claude for a single response:

export async function POST(req) {
  const { messages } = await req.json();

  const res = await fetch('https://api.anthropic.com/v1/messages', {
    method: 'POST',
    headers: {
      'x-api-key': process.env.ANTHROPIC_API_KEY,
      'anthropic-version': '2023-06-01',
      'content-type': 'application/json',
    },
    body: JSON.stringify({
      model: 'claude-sonnet-4-5',
      max_tokens: 1024,
      messages,
    }),
  });

  const data = await res.json();
  return Response.json(data);
}

This works fine for short, non-streaming calls. For anything longer, you'll hit Vercel's execution timeout before Claude finishes generating, especially on the Hobby plan.

Streaming from an Edge Function

To stream tokens as they're generated, switch to the Edge runtime and pipe the response body directly:

export const runtime = 'edge';

export async function POST(req) {
  const { messages } = await req.json();

  const upstream = await fetch('https://api.anthropic.com/v1/messages', {
    method: 'POST',
    headers: {
      'x-api-key': process.env.ANTHROPIC_API_KEY,
      'anthropic-version': '2023-06-01',
      'content-type': 'application/json',
    },
    body: JSON.stringify({
      model: 'claude-sonnet-4-5',
      max_tokens: 1024,
      stream: true,
      messages,
    }),
  });

  return new Response(upstream.body, {
    headers: { 'Content-Type': 'text/event-stream' },
  });
}

This avoids buffering the whole response in memory and gets the first token to the client as fast as possible, which matters a lot for perceived latency in chat UIs.

Timeout and Cold Start Considerations

A few practical notes from running this pattern in production:

• Long generations on Node functions will time out. If you're on Hobby or Pro and not using the Edge runtime, set maxDuration in your route config, or switch to Edge/streaming.
• Cold starts matter less with Edge functions since they run closer to the request and skip the Node.js bootstrap, but your first call to Claude still pays normal model latency — that's unavoidable regardless of platform.
• Retry logic belongs in your function, not the client. Transient 429s or 529s from the Anthropic API should be retried server-side with backoff before the client ever sees an error.
• Don't fan out parallel Claude calls from a single Edge function without checking your rate limits — Vercel will happily let you hit your Anthropic quota faster than you'd like.

Simplifying the Backend with SubToAPI

If you'd rather not manage raw Anthropic keys, retry logic, and usage tracking yourself across every serverless function, SubToAPI sits between your Vercel deployment and Claude. You get an application key (sub_live_...) instead of a raw provider key, built-in streaming support, and per-key usage metadata — useful if multiple apps or team members are calling Claude from the same Vercel project.

The Edge function above becomes:

export const runtime = 'edge';

export async function POST(req) {
  const { messages } = await req.json();

  const upstream = await fetch('https://api.subtoapi.app/v1/messages', {
    method: 'POST',
    headers: {
      Authorization: `Bearer ${process.env.SUBTOAPI_KEY}`,
      'content-type': 'application/json',
    },
    body: JSON.stringify({
      model: 'claude-sonnet-4-5',
      max_tokens: 1024,
      stream: true,
      messages,
    }),
  });

  return new Response(upstream.body, {
    headers: { 'Content-Type': 'text/event-stream' },
  });
}

Same deployment shape, same Edge runtime, but you get a dashboard for usage and seats instead of juggling raw provider keys across environments. See the quickstart and streaming docs for the full request/response shape, or check pricing if you're deploying for a team.

Deployment Checklist

• API key stored as a Vercel environment variable, never in client code
• Edge runtime selected for any route that streams
• maxDuration configured on Node routes if generations run long
• Retry/backoff handled server-side for transient errors
• Preview deployments using a separate (rate-limited) key from production

FAQ

Does Vercel's Hobby plan support long Claude API calls? It supports them up to the function timeout (10 seconds by default). For anything longer, use the Edge runtime with streaming, or upgrade to Pro and raise maxDuration.

Should I use the Edge runtime or Node.js serverless functions for Claude? Use Edge for streaming chat responses — it handles token-by-token output better and has lower cold-start latency. Use Node.js functions for single-shot calls where you need full Node APIs.

How do I keep my Claude API key safe when deploying to Vercel? Store it as an environment variable scoped to server-side code only, never reference it in client components, and use separate keys for Preview and Production deployments to limit blast radius if one leaks.