一、为什么会出现跨域问题呢？

首先了解一下同源策略(SOP)，它是由Netscape公司在1995年引入浏览器的。同源策略是浏览器中最基本最重要的安全功能，如果缺少了同源策略，我们的浏览器就会很容易受到XSS、CSFR等攻击。而所谓的同源策略是指：协议+域名+端口三者相同。
因此，当我们请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域。

二、解决跨域问题的方法

1、通过JSONP跨域

通过 script 标签的 src 属性进行跨域请求，如果服务端要响应内容则首先读取请求参数 callback 的值，callback 是一个回调函数的名称，服务端读取 callback 的值后将响应 内容通过调用 callback 函数的方式告诉请求方。
核心思想：网页通过添加一个script元素，向服务器请求 JSON 数据，服务器收到请求后，将数据放在一个指定名字的回调函数的参数位置传回来。

2、添加响应头

cors是跨域资源共享，是一种基于 HTTP 头的机制，该机制通过允许服务器标示除了它自己以外的其它 origin（域，协议和端口），使得浏览器允许这些 origin 访问加载自己的资源。服务端设置了Access-Control-Allow-Origin就开启了CORS，所以这种方式只要后端实现了CORS，就解决跨域问题。
 //允许白名单域名进行跨域调用
 config.addAllowedOrigin("*");
 //允许跨域发送 cookie
 config.setAllowCredentials(true);
 //放行全部原始头信息
 config.addAllowedHeader("*");
 //允许所有请求方法跨域调用

 config.addAllowedMethod("*");

package com.xuecheng.system.config;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;
/**
* @description 跨域过虑器
* @author Mr.M
* @date 2022/9/7 11:04
* @version 1.0
*/
@Configuration
public class GlobalCorsConfig {
 /**
 * 允许跨域调用的过滤器
 */
 @Bean
 public CorsFilter corsFilter() {
 CorsConfiguration config = new CorsConfiguration();
 //允许白名单域名进行跨域调用
 config.addAllowedOrigin("*");
 //允许跨越发送 cookie
 config.setAllowCredentials(true);
 //放行全部原始头信息
 config.addAllowedHeader("*");
 //允许所有请求方法跨域调用
 config.addAllowedMethod("*");
 UrlBasedCorsConfigurationSource source = new 
UrlBasedCorsConfigurationSource();
 source.registerCorsConfiguration("/**", config);
 return new CorsFilter(source);
 }
}

此配置类实现了跨域过虑器，在响应头添加 Access-Control-Allow-Origin。

3.Nginx反向代理解决跨域

由于服务端之间没有跨域，浏览器通过 nginx 去访问跨域地址。利用了服务器和服务器之间通信不受浏览器的同源策略的限制