HTTP 头部- Origin Referer

Origin & Referer

Origin Header 示例

Origin 请求头部是一个 HTTP 头部，它提供了发起请求的网页的源（协议、域名和端口）信息。它通常在进行跨域资源共享（CORS）请求时使用，以便服务器可以决定是否接受请求。

假设我们在浏览器的地址栏输入并访问 http://www.example.com，这个网站上有一个 AJAX 请求，该请求需要从 https://api.example.com/data 获取数据。当这个 AJAX 请求被发出时，浏览器会自动添加一个 Origin 头部到这个请求中，如下所示：

Origin: http://www.example.com

服务器 https://api.example.com 会检查这个 Origin 头部，根据设置的 CORS 策略来决定是否允许这个请求。如果 CORS 策略允许来自 http://www.example.com 的请求，服务器将响应数据并在响应头部中包含适当的 Access-Control-Allow-Origin 头部。

Referer Header 示例

Referer 请求头部是一个 HTTP 头部，它标识了发起 HTTP 请求的网页的 URI。它用于告知服务器请求是从哪个页面发起的，通常用于日志记录、分析流量来源以及防止 CSRF 攻击等。

假设我们正在浏览 http://www.example.com/index.html 页面，这个页面上有一个链接指向 http://www.othersite.com/info.html。当点击这个链接时，浏览器会发起一个请求到 http://www.othersite.com/info.html，并且在这个请求中包含一个 Referer 头部，如下所示：

Referer: http://www.example.com/index.html

http://www.othersite.com 的服务器可以查看 Referer 头部，了解用户是从哪个页面跳转过来的。这可以帮助网站管理员了解他们的网站流量来源。同时，Referer 头部有时也被用于反盗链措施，服务器可以检查 Referer 头部，以确保请求是从受信任的来源发起的。

注意事项

• Origin 头部仅包含协议、域名和端口，没有路径信息，而 Referer 头部则包含完整的 URI。
• Origin 头部主要用于 CORS 场景中，以确定是否允许跨域请求，而 Referer 头部则广泛用于日志记录、防盗链和安全检查。
• 由于隐私和安全考虑，某些用户或浏览器配置可能会剥离这些头部，或者使用 Referrer-Policy 头部来限制 Referer 头部的信息量。

---

Access-Control-Allow-Origin

Access-Control-Allow-Origin 是一个 HTTP 响应头，用于指定在跨源资源共享（CORS, Cross-Origin Resource Sharing）中，允许哪些域名访问该资源。CORS 是一种机制，它使用额外的 HTTP 头来告诉浏览器让一个 web 应用运行在一个源上的脚本，有权限访问另一个源的选定资源。

当一个资源（如字体、JavaScript 等）从与请求网页不同的域、协议或端口请求时，浏览器会实施同源安全策略，阻止跨源 HTTP 请求。Access-Control-Allow-Origin 响应头是服务器告诉浏览器：对于请求的资源，哪些域是被允许的。

格式

Access-Control-Allow-Origin:  | *

• 指定了允许访问资源的域。这个值必须是请求来自的域的精确匹配，或者是一个特殊的值 *。
• * 表示接受任何域的请求，也就是说，资源可以被任何域访问。

示例

1. 特定域名

   如果服务器只允许来自 http://www.example.com 的跨源请求，服务器的响应将包含如下头部：

   Access-Control-Allow-Origin: http://www.example.com
   

   这表明只有 http://www.example.com 上的页面可以请求这个资源。

2. 任何域名

   如果服务器配置为接受来自任何域的跨源请求，它将包含如下头部：

   Access-Control-Allow-Origin: *
   

   这意味着任何源的页面都可以请求这个资源。不过，使用通配符 * 需要谨慎，因为它可能会引入安全问题。尤其是在响应包含敏感数据时，应该避免使用 *，而是指定明确的、受信任的源。

注意事项

• 在处理带有凭证的请求（如 Cookies 和 HTTP 认证信息）时，Access-Control-Allow-Origin 不能使用 *。必须指定一个明确的、受信任的域。
• 如果请求的资源需要多个域的访问权限，服务器需要在接收到请求后，根据请求的 Origin 头部动态设置 Access-Control-Allow-Origin 的值。
• 使用 Access-Control-Allow-Origin 时，还可能需要配合其他 CORS 相关的头部使用，如 Access-Control-Allow-Methods 和 Access-Control-Allow-Headers 等，以实现完整的 CORS 支持。

通过适当配置 Access-Control-Allow-Origin 和其他相关的 CORS 响应头，开发者可以灵活控制资源跨源访问的权限，既保证了 Web 应用的安全性，又提高了资源的可用性和互操作性。