当前位置：首页 > news >正文

深入理解同源策略与跨域资源共享（CORS）

news 来源：原创 2025/4/29 6:13:44

深入理解同源策略与跨域资源共享（CORS）

前言

在当今的 Web 开发中，跨域资源请求已成为常见需求。然而，浏览器的同源策略（Same-Origin Policy）作为最基础的安全机制，限制了不同源之间的资源交互。这种限制虽然保障了用户数据安全，但也给开发者带来了挑战。为此，跨域资源共享（CORS）应运而生。本文将深入探讨同源策略的核心原理、CORS 的工作机制，以及如何通过合理配置实现安全的跨域通信。

一、同源策略：Web 安全的基石

同源策略是浏览器最核心的安全策略之一，其核心目标是隔离不同源的资源，防止恶意网站窃取用户数据或发起攻击。

1. 什么是“同源”？

两个 URL 的 协议、主机、端口 完全一致时，才被视为同源。例如：

http://example.com/app 与 http://example.com/api 同源（协议、主机、端口一致）。
https://example.com 与 http://example.com 不同源（协议不同）。
http://example.com:8080 与 http://example.com:80 不同源（端口不同）。

2. 同源策略的限制范围

同源策略通过以下三个方面保障安全：

DOM 访问限制
- 禁止 JavaScript 跨域访问其他页面的 DOM，防止恶意脚本窃取敏感信息。
Web 数据限制
- 限制通过 XMLHttpRequest 或 Fetch API 加载跨域资源，防范 CSRF 攻击。
网络通信限制
- 阻止跨域请求的响应数据被脚本读取，除非服务器显式允许（如通过 CORS）。

二、跨域资源共享（CORS）

当需要合法跨域请求时，CORS 提供了一种安全可控的解决方案。

1. 简单请求

满足以下条件的请求不会触发预检（Preflight）流程：

HTTP 方法：仅限 GET、HEAD、POST。
请求头：仅包含以下标头：
Accept、Accept-Language、Content-Language、Content-Type（值限于 text/plain、multipart/form-data、application/x-www-form-urlencoded）。
无自定义标头或流式数据。

示例流程：

浏览器直接发送请求，并在 Origin 头中声明来源。
服务器返回响应，若允许跨域，需设置 Access-Control-Allow-Origin 头。

2. 预检请求（Preflight Request）

非简单请求（如使用 PUT、DELETE 方法或自定义标头）会触发预检流程：

浏览器先发送 OPTIONS 请求，携带以下关键头信息：
- Origin：请求来源。
- Access-Control-Request-Method：实际请求的 HTTP 方法。
- Access-Control-Request-Headers：自定义请求头列表。
服务器响应预检请求，通过以下头信息声明允许的配置：
- Access-Control-Allow-Origin：允许的源（如 https://example.com）。
- Access-Control-Allow-Methods：允许的 HTTP 方法（如 POST, GET）。
- Access-Control-Allow-Headers：允许的自定义头（如 Content-Type）。
- Access-Control-Max-Age：预检结果缓存时间（单位：秒）。
预检通过后，浏览器发送实际请求。

3. 附带凭证的请求

若请求需要携带 Cookie 或认证信息，需注意：

服务器必须设置 Access-Control-Allow-Origin 为具体域名（不能为通配符 *）。
响应头需包含 Access-Control-Allow-Credentials: true。

错误示例：

Access-Control-Allow-Origin: *  
Access-Control-Allow-Credentials: true

此时浏览器会拒绝请求，因通配符与凭证不兼容。

三、CORB：跨域数据隔离机制

跨域读取阻止（Cross-Origin Read Blocking, CORB）是浏览器的另一层防护机制，其核心目标是在恶意代码执行前拦截跨域敏感数据（如 JSON、HTML）。例如，即使服务器未正确配置 CORS，CORB 也会阻止脚本读取跨域的 JSON 文件。

四、最佳实践

服务器配置
- 避免使用 Access-Control-Allow-Origin: *，明确指定允许的源。
- 限制 Access-Control-Allow-Methods 和 Access-Control-Allow-Headers 的范围。
开发注意事项
- 优先使用简单请求，减少预检开销。
- 敏感接口需启用 HTTPS 并严格校验来源。