AZ Tools

CORS 头构建器

网络

构建服务器为满足浏览器跨源请求需要发送的响应头。包含 Allow-Origin、Allow-Methods、Allow-Headers、Expose-Headers、Allow-Credentials、Max-Age 以及 Vary: Origin 提示。标记常见雷区:把 * 与 credentials 一起使用(浏览器会拒绝)、接受 Origin: null(攻击者可伪造)、或让浏览器把预检缓存得过久。

预设
Allow-Methods
响应头
Access-Control-Allow-Origin: https://example.com
Access-Control-Allow-Methods: GET, POST
Access-Control-Allow-Headers: Content-Type, Authorization
Access-Control-Allow-Credentials: true
Access-Control-Max-Age: 600
Vary: Origin

对预检 OPTIONS 与实际请求的响应都应用这些。回传 Origin 时,边缘缓存需要 Vary: Origin。

使用方法

  1. 从与你场景匹配的预设开始。
  2. 设置 origin(公开为 *,凭证 API 应在服务端回传请求的 Origin)。
  3. 只选择你的端点实际接受的方法与头 — 越收紧越安全。
  4. 把这些头复制到你的服务器、边缘 worker 或框架中间件中。

常见问题

可以同时使用 * 与 credentials 吗?
不行。fetch 规范会拒绝同时含有 Access-Control-Allow-Origin: * 与 Access-Control-Allow-Credentials: true 的响应。要么去掉 credentials,要么在服务端基于白名单验证请求 Origin 后再回传。
为什么推荐 Vary: Origin?
如果你把 Origin 回传到 Allow-Origin,下游缓存必须按请求的 Origin 头来区分存储的响应;否则可能把一个站点的 CORS 响应提供给另一个站点的请求。Vary: Origin 告诉缓存按该头作为键。

相关工具