场景：
业务要求从把系统B嵌入到系统A中，系统A和系统B是完成不同的两个域名，前端同事完成系统嵌入后，从A系统内部调用B系统的接口时候发现跨域错误（CORS error），如下：
什么是跨域？
跨域(Cross Origin)指浏览器不允许当前页面所在的源去请求另一个源的数据，跨域也就是跨源的意思。
什么是同源？
同源策略(SOP Same origin policy)：是一种约定，由Netscape公司1995年引入浏览器，它是浏览器最核心也是最基本的安全功能，如果缺少同源策略，浏览器很容易受到XSS、CSFR等攻击，所谓同源是指"协议+域名+端口"三者相同，必须满足这三个条件，才算做同源。
跨域具体场景举例：
什么原因导致浏览器报跨域错误？
发起ajax请求的那个页面的地址 和 ajax接口地址 不在同一个域中，直接导致了跨域问题，也就是说跨域问题发生在浏览器。
跨域问题解决方案：
Nginx 反向代理解决跨域
Nginx 反向代理解决跨域，只需要在 nginx 上增加配置文件，即可解决跨域问题，如下：
Nginx 增加配置解决跨域问题，只使用一种解决问题即可，不要同时配置多个。
Nginx 知识传送门：
Nginx 故障排查之斜杠(/) --（附 Nginx 常用命令）
服务端解决跨域问题
解决 CORS 跨域问题，就是在服务器端给响应添加头信息，解释如下：
Access-Control-Allow-Origin 允许请求的域
Access-Control-Allow-Methods 允许请求的方法
Access-Control-Allow-Headers 预检请求后，告知发送请求需要有的头部
Access-Control-Allow-Credentials 表示是否允许发送cookie，默认false；
Access-Control-Max-Age 本次预检的有效期，单位：秒；
1、使用过滤器解决跨域问题，注意该方案需要在启动类加注解：@ServletComponentScan({“com.my.study.main.filter”}
2、过滤器解决跨域的另外一种实现方式。
2、添加 @Configuration 注解，实现 WebMvcConfigurer 接口，解决跨域问题。
跨域解决方案总结：
推荐使用 Nginx 处理跨域问题，只需要在nginx 上增加配置即可解决问题，而服务端解决跨域问题，或多或少都需要写代码，本着少改代码的原则，强烈建议使用 Nginx 的方式解决跨域问题，不管使用哪种方式解决跨域问题，只需要使用一种即可，不要多种方式叠加使用。
温馨提示：
跨域问题通常是伴随多个系统一起出现了，也就是出现了跨系统调用，可能会出现跨域问题，这个时候要主要多个系统的权限认证是否通用，如果权限认证不通用，要优先解决权限认证的问题，否则也是提示跨域问题，浏览器端常见错误如下：
什么是预检（OPTIONS）请求？
浏览器使用 OPTIONS 方法发起一个预检请求（preflight request），来感知服务端是否允许该跨域请求，服务器确认允许之后，才发起实际的 HTTP 请求，OPTIONS 请求没有附带请求数据，响应体也为空，简单来说就是一种探测，这就是预检请求，是浏览器的一种保护机制。
预检（OPTIONS）请求的作用？
- 跨域场景中使用了预检请求，跨域请求失败产生错误，代码层无法获知感知错误发生的地方，这时候可以查看浏览器的控制台来查询错误信息。
- 检测服务器支持的请求方法。
什么时候会触发预检（OPTIONS）请求？
非简单请求时候会触发预检请求。
简单请求与非简单请求：
简单请求：
- 请求方法是 GET、HEAD、POST 中的一种。
- HTTP的头信息只能是 Accept、Accept-Language、Content-Language、Last-Event-ID、Content-Type 中的某几个，不能超出这个范围。
- Content-Type 的值只能是 textplain、multipart/form-data、application/x-www-form-urlencoded 中的一种。
- 请求中没有使用 XMLHttpRequestUpload 对象。
- 请求中没有使用 ReadableStream 对象。
如有错误的地方欢迎指出纠正。
到此这篇cors跨域解决方案（cors解决跨域问题）的文章就介绍到这了,更多相关内容请继续浏览下面的相关推荐文章，希望大家都能在编程的领域有一番成就！版权声明：
本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如若内容造成侵权、违法违规、事实不符，请将相关资料发送至xkadmin@xkablog.com进行投诉反馈，一经查实，立即处理！
转载请注明出处，原文链接：https://www.xkablog.com/rfx/22035.html