跨域资源共享cors

跨域资源共享（CORS）

1. 跨域资源共享（CORS）

是一种机制，用于放宽浏览器的同源策略，使得一个域可以访问另一个域的数据。随着互联网应用的日益复杂，CORS成为解决跨域问题的标准方法之一。

2. 浏览器的同源策略

浏览器为了安全起见，遵循同源策略（Same-origin policy），即只有当请求的源（协议、域名、端口）与资源所在的源完全相同时，才允许进行交互。这种策略有效地防止了某些类型的攻击，但也限制了跨域数据的访问。

示例：
假设你有一个网站 example.com 并且想要请求来自 data.example.org 的资源，如果没有CORS的支持，浏览器会阻止这个请求。

3. CORS基本原理

CORS通过HTTP头部信息来控制跨域访问的权限，允许服务器指定哪些源可以访问其资源。

• 简单请求：当请求符合以下条件时，被视为简单请求：

  • 方法为 GET、HEAD 或 POST；
  • Content-Type 头部的值仅限于 application/x-www-form-urlencoded、multipart/form-data 或 text/plain。

• 预检请求：对于不符合简单请求条件的请求，浏览器会自动发送一个预检请求（OPTIONS方法），以询问服务器是否允许实际请求。预检请求会包含：

  • Access-Control-Request-Method 头部，指示实际请求的方法；
  • Access-Control-Request-Headers 头部，列出实际请求中可能会包含的自定义头部。

示例：
一个简单的GET请求可以直接发送到服务器，而一个包含自定义头部的POST请求则会先发送一个预检请求。

// 客户端发起预检请求
fetch('https://api.example.com/data', {
   
   
  method: 'POST',
  headers: {
   
   
    'Content-Type': 'application/json',
    'X-Custom-Header': 'XYZ'
  },
  body: JSON.