跨域

跨域详解！前后端分离解决跨域问题_iqqcode的博客-CSDN博客_前后端分离为什么会出现跨域

跨域问题是什么

由于浏览器的同源策略限制。

1.Cookie只能在当前域名下生效

2.同源策略（Same-Origin-Policy）是一种约定，它是浏览器最核心、最基本的安全功能。如果缺少了同源策略，则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的，浏览器只是针对同源策略的一种实现。同源策略会阻止一个域的JavasSript脚本和另外一个域的内容进行交互。

服务器之间的请求是不存在跨域问题的！

同源（即指在同一个域）:两个页面具有相同的协议（protocol），主机（host）和端口号（port）

协议相同
域名相同
端口相同

解决方案

Jsonp前后端配合

JSONP 是服务器与客户端跨源通信的常用方法。最大特点就是简单适用，兼容性好（兼容低版本IE）

【缺点】

只支持get请求，不支持post请求
只支持跨域HTTP请求

【核心思想】：

网页通过添加一个<script>元素，向服务器请求 JSON 数据，服务器收到请求后，将数据放在一个指定名字的回调函数的参数位置传回来。

CORS

CORS是一种W3C标准，全称是"跨域资源共享(Cross-origin resource sharing)"。它允许浏览器向跨源服务器发出XMLHttpRequest请求，从而克服了同源使用的限制。

实现CORS很简单，就是在服务端加一些响应头，对前端来说是无感知的。

详解响应头 Access-Control-Allow-Origin

该字段必填它的值要么是请求时Origin字段的具体值，要么是一个*，表示接受任意域名的请求。 Access-Control-Allow-Methods

该字段必填它的值是逗号分隔的一个具体的字符串或者*，表明服务器支持的所有跨域请求的方法。注意，返回的是所有支持的方法，而不单是浏览器请求的那个方法。这是为了避免多次"预检"请求。

SpringBoot

【方式一】全局配置

        registry.addMapping("/**") // 所有的当前站点的请求地址，都支持跨域访问
                .allowedOrigins("*") // 所有的外部域都可跨域访问。 如果是localhost则很难配置，因为在跨域请求的时候，外部域的解析可能是localhost、127.0.0.1、主机名
                .allowedMethods("GET", "HEAD", "POST", "PUT", "DELETE", "OPTIONS") // 当前站点支持的跨域请求类型是什么
                .allowCredentials(true) // 是否支持跨域用户凭证
                .maxAge(3600) // 超时时长设置为1小时。 时间单位是秒。
                .allowedHeaders("*"); //获取所有请求头字段

【方式二】@CrossOrigin

 @CrossOrigin(origins = "http://localhost:8181")

Nginx反向代理解决跨域问题

nginx作为反向代理服务器，就是把Http请求转发到另一个或者一些服务器上。通过把本地一个url前缀映射到要跨域访问的web服务器上，就可以实现跨域访问。

跨域问题详解

跨域