开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第1天，点击查看活动详情
基本概念
- 基于HTTP头信息的机制，服务器设置 origin 使得浏览器允许 origin 访问加载自己的资源。通过预检请求检查服务器是否会允许要发送的真实请求。
- 浏览器限制脚本内发起的跨源 HTTP 请求，同源策略。
简单请求（不会出发预检请求条件）
满足一下所有条件称之为简单请求。
- 使用下列方法之一：
-
- GET
- HEAD
- PSOT
- 仅包含以下字段
-
- Accept
- Accept-Language
- Content-Language
- Content-Type
- Content-Type的值仅限以下三者之一
-
- text/plain
- multipart/form-data
- application/x-www-form-urlencoded
- 请求中的任意 XMLHttpRequest 对象均没有注册任何事件监听器；可以使用XMLHttpRequest.upload 属性访问当前状态。
- 请求中没有使用 ReadableStream 对象
注意： 当响应的是携带身份凭证的请求时，服务端必须 明确 Access-Control-Allow-Origin的值，而不能使用通配符"*"。
预检请求
预检请求必须首先使用 OPTIONS 方法发起一个预检请求到服务器，以获知服务器是否允许该实际请求。可以避免跨域请求对服务器的用户数据产生未预期的影响。
注意： Access-Control-Max-Age 表明该响应的有效时间为 86400秒（24小时）。在有效时间内，浏览器无需为同一请求再次发起预检请求。浏览器自身维护了一个最大有效时间，如果该字段的值超过了浏览器的值，将不会生效。
携带身份凭证的请求
跨域请求中浏览器不会发送身份凭证信息。如果要发送凭证信息，需要设置 XMLHttpRequest.withCredentials:true。服务器端的响应中必须携带 Access-Control-Allow-Credentials:true,浏览器才会把响应的内容返回给请求者。
