跨域

Cross-origin Resource Sharing 跨域资源共享，简称 "CORS"，它突破了一个请求在浏览器发出只能同源的情况下向服务器获取数据的限制。

浏览器限制

浏览器限制从脚本内发起的跨域HTTP请求，当一个请求在浏览器端发送出去后，服务端会收到并且也会处理和响应，只不过在浏览器解析这个请求的响应之后，发现不属于浏览器的同源策略，也没有包含正确的 CORS 响应头，返回结果被浏览器拦截了。

预检请求

预检请求是在发送实际的请求之前，客户端首先会发送一个options方法的请求向服务器确认，如果通过之后，浏览器才会发起真正的请求，这样可以避免跨域请求对服务器的用户数据造成影响。

cors 将请求分为了两类：简单请求和非简单请求，请求方法为：GET、POST、HEAD，请求头 Content-Type为：text/plain、multipart/form-data、application/x-www-form-urlencoded的属于“简单请求”不会触发CORS预检请求。

客户端：

1. Origin: 表示请求来自哪个源；
2. Access-Control-Request-Method: 实际请求将使用PUT方法；
3. Access-Control-Request-Headers: 实际请求将使用两个头部字段 content-type,test-cors，这里如果content-type指定的为简单请求中的几个值，实际请求将只有test-cors这一个头部字段。

服务端：

1. Access-Control-Allow-Origin: 请求源，也可设置为*，表示允许任意跨源请求；
2. Access-Control-Allow-Methods: 表示服务器允许客户端使用的请求方法，可以一次设置多个，表示服务器所支持的所有跨域方法，而不单是当前请求的那个方法，这样也是为了避免多次预检请求；
3. Access-Control-Allow-Headers: 表示服务器允许请求中携带的字段，可以设置多个；
4. Access-Control-Max-Age: 表示响应的有效期，单位为秒，在有效期内，浏览器无须为同一请求再次发起预检请求，该值需要小于浏览器自身维护的最大有效时间，否则无效。

cors与认证

对于跨域的 XMLHttpRequest或fetch请求，浏览器是不会发送身份凭证信息的。

如果我们在请求中设置了credentials:"include"服务端就不能设置Access-Control-Allow-Origin:"*"，只能设置一个明确的地址

解决跨域问题

使用CORS模块

CORS在预检请求后或在预检请求里设置了preflightContinue属性之后才会执行nextFn这个函数，如果预检失败就不会执行nextFn函数

JSONP

浏览器是允许像link、img、script标签在路径上加载一些内容进行请求，是允许跨域的，jsonp的实现原理就是在script标签里面加载一个链接，去访问服务器的某个请求，返回内容，但是JSONP只支持GET请求。

Nginx代理服务器配置跨域

使用Nginx代理服务器后，请求不会直接到达服务器，会先经过Nginx，在设置一些跨域等信息之后再由Nginx转发到我们的服务端。