Add API External Origin Routing Rule

Add API External Origin Routing Rule is a Vercel CDN configuration template that creates a project-level rewrite rule, proxying all requests under /api to an external backend without code changes or redeployment.

What is Add API External Origin Routing Rule?

This template produces a rewrite rule for the Vercel CDN layer. It takes a path pattern (/api/:path*) and a destination URL (https://api.example.com/$1), and outputs a published routing rule on your Vercel project. The rule can be configured through the Vercel Dashboard, CLI, REST API, or SDK, and it is part of Vercel's curated examples collection.

Key Features

• Instant activation — Routing rules take effect immediately after publishing, with no code deployment required.
• Path-based rewriting — Matches all requests matching /api/:path* and rewrites them to an external origin.
• CDN proxying — Puts the Vercel CDN in front of your backend, leveraging the global edge network for performance.
• Built-in caching — Supports CDN-Cache-Control headers to cache responses at the edge.
• Cache tags — Supports Vercel-Cache-Tag headers for targeted cache purging.
• Security layer — Adds the Vercel Firewall for protection against attacks.
• Multiple configuration methods — Configure via Vercel Dashboard, CLI (vercel routes add), REST API, or SDK.

Who is it for?

• Teams hosting APIs separately — Proxy existing backend APIs through a Vercel domain to avoid CORS issues and hide backend URLs from clients.
• Developers managing routing without redeploys — Update routing rules instantly through project-level settings, bypassing full deployments.
• CDN optimization engineers — Use Vercel's edge network and caching features to improve API performance and reduce origin load.

Use cases

• Frontend applications with separate API backends: Rewrite /api requests to a dedicated API server, maintaining same-origin for browsers and simplifying CORS.
• Legacy backend integration: Serve existing APIs under a new Vercel domain without modifying backend code.
• Global performance improvement: Route API traffic through Vercel's edge nodes to reduce latency for users worldwide.

How does it work?

1. Click "Add Route" on the template page.
2. Select your team and project.
3. Replace the destination https://api.example.com/$1 with your actual backend URL.
4. Save the rule, review your changes, and click "Publish" to activate.

The same rule can be created via the CLI by running vercel routes add with the source pattern, action, and destination, then vercel routes publish.

FAQ

Is this template free?

The template itself is free to use, but Vercel's platform may have associated costs for CDN usage, caching, and firewall features depending on your plan.

What does the routing rule do?

It rewrites all requests matching /api/:path* on your Vercel domain to an external origin URL, proxying the traffic through Vercel's CDN.

Can I customize the path pattern?

Yes, you can adjust /api/:path* to match your specific API paths and update the destination URL to point to any external backend.

How do I enable caching?

Add a CDN-Cache-Control header in the response to cache responses at the edge, or use Vercel-Cache-Tag for targeted cache purging.

Can I configure this with code?

Yes, you can define routing rules in code using vercel.ts for version control, as shown in the Proxy requests to external origins template.