主题
跨域处理
浏览器的同源策略限制跨源脚本读取响应。CORS 通过响应头声明允许的来源、方法和请求头;它不是服务端鉴权机制。
bash
pnpm add cors限制允许来源
不要在需要 Cookie 或凭据的接口上使用任意来源。将可信前端地址显式加入白名单。
js
import cors from 'cors'
const allowedOrigins = new Set(['https://app.example.com', 'http://localhost:5173'])
app.use(
cors({
origin(origin, callback) {
if (!origin || allowedOrigins.has(origin)) {
return callback(null, true)
}
callback(new Error('不允许的来源'))
},
methods: ['GET', 'POST', 'PUT', 'PATCH', 'DELETE'],
allowedHeaders: ['Content-Type', 'Authorization'],
}),
)携带 Cookie
跨站请求需要同时满足:服务端设置 credentials: true,且 origin 为明确的来源,不能使用 *;客户端使用 fetch 时设置 credentials: 'include'。Cookie 本身还需配置合适的 SameSite、Secure 和 HttpOnly 属性。
js
app.use(
cors({
origin: 'https://app.example.com',
credentials: true,
}),
)