JS脚本请求跨域

跨域请求是针对 JS 的，也就是浏览器输入的网址协议+地址+端口号部分如果与执行脚本发送的 HTTP 请求地址有一处不同的话，就会被 CORS policy 跨域协议所
拦截，注意这里只针对 JS 脚本发出的 HTTP 请求

图中地址栏端口号为 8001，但是请求的地址为 88 端口，当执行登陆时，login 的 js 脚本就会发送请求给 88，就会导致跨域请求，但是图中的验证码虽然也是向 88 端口发送请求，但是其实在 src 属性中填充的地址，不是 js 脚本发送的请求所以不会引起跨域请求

跨域请求流程
当点击登录时，浏览器发现是跨域请求，会先发送一个预检请求，也就是 Request Method 为 OPTIONS 给请求的服务器，服务器根据收到请求判断是不是简单的请求，如果是简单请求就响应允许跨域（响应头中会包含允许的来源、允许跨域方法、允许跨域请求格式），这时候浏览器收到服务器允许跨域的通知后，才会发送一个真实请求，然后服务器响应数据；如果服务器发现不是简单请求，就会拒绝该请求，浏览器端就会显示被 CORS policy 跨域协议所拦截

**
**
简单请求定义https://developer.mozilla.org/zh-CN/docs/Web/HTTP/CORS

如何在开发中进行跨域请求呢？
我们在微服务开发中，开发的管理后台因为管理多个微服务，不可避免向微服务发送请求，这时候就会引起跨域，这应该怎么解决呢？

• 通过 Ngnix 将管理后台和网关置于同一域中：

这样管理后台发送的所有请求都是 Ngnix，然后被 Ngnix 反向代理，发送给同一域中的网关，网关接收到请求后，然后经过断言判断、过滤等操作发给真正的微服务（这时候不要求微服务也在同域中）

• 管理后台发送给网关的请求，网关直接返回允许跨域的响应：

上面知道服务器如果允许跨域，会返回一个响应，响应头中会有这么几个响应头字段：

• Access-Control-Allow-Origin（允许访问该服务的外部 URL）
• Access-Control-Allow-Methods（字段用于预检请求的响应，其指明了实际请求所允许使用的  HTTP 方法）
• Access-Control-Allow-Headers（部字段用于预检请求的响应。其指明了实际请求中允许携带的首部字段）