← 返回功能
Free

CORS 检查器

诊断跨域 "被 CORS 阻止" 的错误和预检请求。

"被 CORS 阻止"是浏览器开发中最令人困惑的错误之一——浏览器无声地阻止请求而不向您的代码返回有用的信息,读取原始 CORS 标头很繁琐。CORS 检查器使整个图景清晰。输入目标 URL、HTTP 方法和您想要测试的源(默认为您的当前页面)。可选地列出您计划发送的任何自定义请求标头(内容类型、授权等)。该工具然后运行预检查 OPTIONS 请求(当请求不是"简单"时自动添加),然后是实际请求,并解析每个相关的 CORS 响应标头。然后它呈现一个通过/失败分解:是否正确设置了允许源、允许方法是否包含您的方法、您的自定义标头是否在允许标头中、允许凭证是否与您的凭证标志匹配?最终判决是明确的——ALLOWED 或 BLOCKED——每个检查列表告诉您后端要修复什么。

实时预览
example.com
CORS 检查器 ✓ 测试完成
POST https://api.backend.com/users
来源:https://app.example.com 请求头:content-type,authorization
✓ 请求将被允许
检查项目
Allow-Origin 匹配 https://app.example.com
POST 方法被允许
请求头已被 Allow-Headers 允许
预检请求 (OPTIONS) · 204 无内容
access-control-allow-origin: https://app.example.com
access-control-allow-methods: GET, POST, PUT, DELETE
access-control-allow-headers: content-type, authorization
access-control-max-age: 86400
核心功能

自动预检查检测

检测何时会运行预检查 OPTIONS 请求(非简单方法或自定义标头)并自动使用正确的访问控制请求标头触发它。

每个检查分解

每个 CORS 规则被单独评估:源匹配、允许的方法、允许的标头、凭证。您看到确切哪个检查失败。

明确的判决

顶部的大绿色 ALLOWED 或红色 BLOCKED 横幅——无需读取标头来找出答案。

完整的标头检查

显示来自预检查和实际请求的每个响应标头,CORS 特定标头被突出显示。

自定义源测试

假装成任何源,不仅仅是当前页面——对于测试如何处理第三方集成很有用。

从后台工作

探针从扩展后台运行,因此跨源获取不会被主机页面自身的 CORS 政策阻止。

使用场景

调试"被 CORS 阻止"错误

当您的前端在控制台中显示 CORS 错误时,使用该工具查看后端缺少的确切标头——比读取规范部分快得多。

验证 API CORS 配置

在发送新的公共 API 之前,从该工具中对其进行测试,以确认每个预期的源、方法和标头组合都有效。

第三方集成测试

与第三方 API 集成时,使用您的计划标头从您的源进行测试,以确认请求将通过。

预检查缓存调试

检查访问控制最大年龄值以查看浏览器将缓存预检查结果多长时间——在标头更改后测试时很有用。

跨环境测试

针对开发、暂存和生产 URL 运行相同的 CORS 测试,以在用户之前捕获特定于环境的错误配置。

使用方法
1

打开 CORS 检查器

单击 DevSuite Pro 停靠栏中的 CORS 图标。打开一个面板,显示 URL、方法、源和标头输入。

2

输入目标 URL 和方法

粘贴您想要测试的 API 端点并选择 HTTP 方法 (GET、POST、PUT、DELETE 等)。

3

设置源和标头

源默认为当前页面。如果测试不同源,请更改它。用逗号分隔列出任何自定义请求标头。

4

单击测试 CORS

该工具运行预检查(如果需要)和实际请求,然后呈现判决和检查。

5

读取并修复

如果被阻止,每个检查列表告诉您后端的响应中缺少什么。修复后端标头并重新测试。

准备好开始了吗?

免费安装 DevSuite Pro,为您的浏览器解锁 64+ 个开发者工具。

添加到 Chrome 添加到 Edge 添加到 Firefox