cors

name	slug	description	framework	useCase	css	deployUrl	demoUrl
CORS in Edge Functions	edge-functions-cors	Handle CORS at the edge.	Next.js	Edge Functions Documentation	Tailwind	https://vercel.com/new/clone?repository-url=https://github.com/vercel/examples/tree/main/edge-functions/cors&project-name=cors&repository-name=cors	https://edge-functions-cors.vercel.app

CORS Example

Below is the code from pages/_middleware.ts:

import type { NextRequest } from 'next/server'
import cors from '../lib/cors'

export async function middleware(req: NextRequest) {
  // `cors` also takes care of handling OPTIONS requests
  return cors(
    req,
    new Response(JSON.stringify({ message: 'Hello World!' }), {
      status: 200,
      headers: { 'Content-Type': 'application/json' },
    })
  )
}

Test it out with:

curl -i -X OPTIONS -H 'origin: https://vercel.com' https://edge-functions-cors.vercel.sh

Demo

https://edge-functions-cors.vercel.app

How to Use

You can choose from one of the following two methods to use this repository:

One-Click Deploy

Deploy the example using Vercel:

Clone and Deploy

Download this repository via git:

git clone https://github.com/vercel/examples.git

Execute create-next-app with npm or Yarn to bootstrap the example:

npx create-next-app --example https://github.com/vercel/examples/tree/main/edge-functions/cors cors
# or
yarn create next-app --example https://github.com/vercel/examples/tree/main/edge-functions/cors cors

Next, run Next.js in development mode:

npm install
npm run dev

# or

yarn
yarn dev

Deploy it to the cloud with Vercel (Documentation).