Next.js 15 CORS 与预检缓存治理实践

核心价值明确允许源与方法，按需开启凭据并在预检中缓存协商结果以降低延迟。设置 `Vary` 避免缓存污染，确保针对不同源与请求头的响应一致性。允许源与方法export const runtime = 'edge'

const ALLOW_ORIGINS = new Set(['https://app.example.com', 'https://admin.example.com'])

const ALLOW_METHODS = 'GET,POST,OPTIONS'

const ALLOW_HEADERS = 'content-type, authorization, x-request-id'

export async function OPTIONS(req: Request) {

const origin = req.headers.get('origin') || ''

const method = req.headers.get('access-control-request-method') || ''

const reqHeaders = req.headers.get('access-control-request-headers') || ''

if (!ALLOW_ORIGINS.has(origin) || !ALLOW_METHODS.includes(method)) {

return new Response('Forbidden', { status: 403 })

}

return new Response(null, {

status: 204,

headers: {

'Access-Control-Allow-Origin': origin,

'Access-Control-Allow-Credentials': 'true',

'Access-Control-Allow-Methods': ALLOW_METHODS,

'Access-Control-Allow-Headers': reqHeaders || ALLOW_HEADERS,

'Access-Control-Max-Age': '600',

'Vary': 'Origin, Access-Control-Request-Method, Access-Control-Request-Headers',

},

})

}

export async function GET(req: Request) {

const origin = req.headers.get('origin') || ''

const body = JSON.stringify({ ok: true, time: Date.now() })

if (!ALLOW_ORIGINS.has(origin)) {

return new Response('Forbidden', { status: 403 })

}

return new Response(body, {

headers: {

'Content-Type': 'application/json; charset=utf-8',

'Access-Control-Allow-Origin': origin,

'Access-Control-Allow-Credentials': 'true',

'Access-Control-Expose-Headers': 'x-request-id',

'Vary': 'Origin',

'Cache-Control': 'no-store',

},

})

}

治理建议凭据请求必须返回具体源而非 `*`，并设置 `Access-Control-Allow-Credentials: true`。预检响应缓存时长通过 `Access-Control-Max-Age` 控制，结合 `Vary` 防止不同请求组合被混淆。对匿名场景可使用 `Access-Control-Allow-Origin: *` 且不含凭据，降低复杂度。结论在 Edge Route Handler 中明确源、方法、头与缓存策略，可显著降低跨域延迟并避免缓存污染，同时保持凭据场景的安全与一致性。