How to Host a Claude API Proxy on Vercel

Hosting a Claude API proxy on Vercel means deploying a serverless function that sits between your frontend (or mobile app, or third-party service) and Anthropic's API. The function holds your real API key server-side, forwards requests to Claude, and returns the response — so your key never ends up in client-side JavaScript or a mobile bundle where anyone can extract it.

This pattern is standard for any app that calls an LLM from the browser: you need a backend hop, and Vercel's serverless/edge functions are a fast, low-cost way to build that hop without running a dedicated server. Below is how to build it properly, plus the operational problems you'll hit once real traffic shows up.

Why you need a proxy at all

If you call Anthropic's API directly from client-side code, your API key is visible in the network tab of every browser that loads your app. Anyone can copy it and run up your bill. A proxy fixes this by keeping the key in an environment variable on the server, never shipped to the client.

A Vercel-hosted proxy also gives you a place to:

• Rewrite or validate incoming requests before they hit Claude
• Add your own auth (so only your logged-in users can call it)
• Log usage per user or per feature
• Cache or rate-limit requests
• Normalize errors into a consistent shape for your frontend

Setting up the project

Start with a minimal Vercel project using serverless functions (the api/ directory convention works with any Vercel-supported framework, including plain Node).

my-claude-proxy/
  api/
    messages.js
  package.json
  vercel.json

Store your Anthropic API key as an environment variable in the Vercel dashboard (Project Settings → Environment Variables), not in code:

ANTHROPIC_API_KEY=sk-ant-...

The proxy function

// api/messages.js
export default async function handler(req, res) {
  if (req.method !== "POST") {
    return res.status(405).json({ error: "Method not allowed" });
  }

  try {
    const response = await fetch("https://api.anthropic.com/v1/messages", {
      method: "POST",
      headers: {
        "content-type": "application/json",
        "x-api-key": process.env.ANTHROPIC_API_KEY,
        "anthropic-version": "2023-06-01",
      },
      body: JSON.stringify(req.body),
    });

    const data = await response.json();
    res.status(response.status).json(data);
  } catch (err) {
    res.status(500).json({ error: "Upstream request failed" });
  }
}

This gives you a working endpoint at /api/messages that your frontend can call without ever seeing the real Anthropic key.

Adding your own authentication

Without auth, your proxy is an open door — anyone who finds the URL can call Claude on your dime. Add a simple bearer token check before forwarding:

const token = req.headers.authorization?.replace("Bearer ", "");
if (token !== process.env.PROXY_SECRET) {
  return res.status(401).json({ error: "Unauthorized" });
}

For anything beyond a single internal app, you'll want per-user tokens rather than one shared secret, which means building a key issuance and revocation system — more on that below.

Streaming responses

Claude supports server-sent events for streaming tokens as they're generated. On Vercel, streaming through a serverless function requires forwarding the upstream stream directly rather than buffering the full response:

export default async function handler(req, res) {
  const upstream = await fetch("https://api.anthropic.com/v1/messages", {
    method: "POST",
    headers: {
      "content-type": "application/json",
      "x-api-key": process.env.ANTHROPIC_API_KEY,
      "anthropic-version": "2023-06-01",
    },
    body: JSON.stringify({ ...req.body, stream: true }),
  });

  res.setHeader("Content-Type", "text/event-stream");
  res.setHeader("Cache-Control", "no-cache");

  for await (const chunk of upstream.body) {
    res.write(chunk);
  }
  res.end();
}

Note that Vercel's serverless functions have execution time limits depending on your plan, and edge functions handle streaming differently than Node serverless functions. Long-running conversations or large completions can hit those limits, so check your plan's timeout before relying on this in production.

What breaks once you have real users

A single-file proxy works fine for a prototype. It starts to fall apart when you need:

• Multiple consumers with separate rate limits. One shared key means one customer's traffic can throttle everyone else.
• Usage visibility. Vercel's logs tell you a function ran — not which user made the call, how many tokens it used, or what it cost.
• Key rotation and revocation. If a key leaks, you need to kill it without redeploying.
• Tool use and multi-step calls. Forwarding raw JSON is fine until you need to manage tool-call loops, retries, and partial failures consistently.
• Team access control. Giving five teammates access to "the proxy" usually means giving them all the same secret, which isn't real access control.

At that point you're not maintaining a 40-line function anymore — you're building an API gateway, and that's a real engineering project with its own maintenance burden.

This is the gap SubToAPI is built for. Instead of hosting your own Vercel function, you point your app at https://api.subtoapi.app/v1/messages with a sub_live_... key issued from your dashboard. You get streaming, tool use, and usage metadata out of the box, plus per-key limits and team seats so you're not sharing one secret across your whole org. Check the quickstart to see the request shape, or the messages and streaming docs if you're migrating an existing proxy. Plans start at €9/month on the pricing page, with a free trial at signup.

If you still want to run your own proxy — for a side project, an internal tool, or because you want full control over the request pipeline — Vercel is a solid choice. Just budget time for auth, rate limiting, and logging once you move past a prototype, because none of that comes free with a serverless function.

FAQ

Do I need a paid Vercel plan to host a Claude proxy? No — the free Hobby tier handles low-traffic proxies fine. You'll need a paid plan once you hit function execution limits, need longer timeouts for streaming, or want team collaboration on the project.

Can I use Vercel Edge Functions instead of serverless functions? Yes, and edge functions often handle streaming more naturally since they're designed around the Fetch API's streaming primitives. The tradeoff is a more restricted runtime — some Node APIs aren't available at the edge.

Is a self-hosted proxy more secure than a managed API gateway? Not inherently. Security depends on how you implement auth, key storage, and rate limiting — a poorly secured self-hosted proxy is riskier than a managed service with built-in per-key controls and revocation.