跨域资源共享（CORS）

CORS是什么？

CORS全称为Cross-Origin Resource Sharing，被译为跨域资源共享，新增了一组HTTP首部字段，允许服务器声明哪些源站有权限访问哪些资源。

跨域资源共享机制的工作原理主要应用于三个场景：

1. 简单请求
2. 预检请求
3. 认证请求

1.简单请求

满足以下三个条件，则该请求可视为“简单请求”：

• 使用下列请求方法之一：GET、HEAD或POST
• 不得人为设置下列集合之外的其他首部字段：Accept、Accept-Language、Content-Language、Content-Type
• Content-Type的值仅限于下列三者之一：
  • text/plain
  • multipart/from-data
  • application/x-www-form-urlencoded

01.请求消息

02.响应消息

2.预检请求

满足以下三个条件，则该请求可视为“预检请求”：

• 使用下列请求方法之一：PUT、DELETE、CONNECT、OPTIONS、TRACE或PATH
• 不得人为设置下列集合之外的其他首部字段：Accept、Accept-Language、Content-Language、Content-Type
• Content-Type的值仅限于下列三者之一：
  • text/plain
  • multipart/from-data
  • application/x-www-form-urlencoded

预检请求要求必须首先使用OPTIONS方法发起一个预检请求到服务器，以获知服务器是否允许该实际请求。

预检请求可以避免跨域请求对服务器的用户数据产生未预期的影响。

01.请求信息

02.响应信息

---

3.认证请求

CORS可以基于HTTP Cookies和HTTP认证信息发送身份凭证。一般而言，对于跨域XMLHttpRequest请求，浏览器不会发送身份凭证信息。如果要发送凭证信息，需要设置XMLHttpRequest的某个特殊标志位。

xmlHttpRequest.withCredentials = true;

将 XMLHttpRequest 的 withCredentials 标志设置为true，使得向服务器发送Cookies，服务器返回响应首部字段Access-Control-Allow-Credentials: true。

如果服务器端的响应中未携带Access-Control-Allow-Credentials: true，浏览器将不会把响应内容返回给请求的发送者。

01.请求信息

02.响应消息