跨域就是一个域名的网页去请求另一个域名的资源，比如你刚刚在A网站输入了自己的账号密码，然后访问B网站，B网站无法获取账号密码

两个请求的协议（比如http），域名（比如说localhost或者192.168.0.0），端口号三者一模一样（其他可以不一样）才算两个请求在同一个域内，三者但凡有一个不一样都是跨域

前后端分离时，前端应用和后端应用是属于两个端口，此时前端工程调用后端工程的接口就会出现跨域问题

比如前端应用是http://localhost:8080，想要访问后端工程的一个list方法，即http://localhost:8181/list，结果会报错，显示：

其实后端是有接收到请求，也给前端工程返回了数据，但是浏览器收到之后拒绝前端读取响应数据

我们需要添加一些配置允许前端工程从浏览器中读取后端响应的数据

CORS:Cross Origin Resource Sharing 跨域资源共享

解决跨域问题有前端解决方案和后端解决方案，主要介绍后端解决方案：

1.在目标方法上添加@CrossOrigin注解

比如现在前端工程想要访问后端工程中的list方法，只需要在这个方法上面添加@CrossOrigin注解即可

GetMapping("list")
@CrossOrigin
public  List<String> list()
{
   return “Hello  World”;
}

2.添加CORS过滤器

如果要允许跨域访问的方法太多，一个一个加@CrossOrigin注解太麻烦了，所以直接设置一个过滤器

在配置类的包configuration中新建一个类CorsConfig

@Configuration
public class CorsConfig
{
   @Bean //注入到容器里面
   public  CorsFilter corsFilter()
   {
      CorsConfiguration corsConfiguration=new CorsConfiguration();
      
      //设置http头信息，允许前端工程从浏览器中读取响应

      corsConfiguration.addAllowedOrigin("*");//允许所有域访问
      
      corsConfiguration.addAllowedHeader("*");

      corsConfiguration.addAllowedMethod("*");

      UrlBasedCorsConfigurationSource source=new  UrlBasedCorsConfigurationSource();

      source.registerCorsConfiguration("/**",corsConfiguration);

      return new  CorsFilter(source);

   }

}

 而list方法对应的代码不用做任何变动（不需要@CrossOrigin注解）

3.实现WebMvcConfigurer接口的方式

在配置类的包中新建一个CorsConfiguration类，这个类实现WebMvcConfigurer接口，并且重写addCorsMappings方法

public class CorsConfiguration implements WebMvcConfigurer
{
    
  @Override
  public  void  addCorsMappings(CorsRegistry registry)
  {
    registry.addMapping("/**)
            .allowedOriginPatterns("*")
            .allowedMethods("GET","PUT","POST","DELETE","HEAD","OPTIONS")
            .allowedHeaders("*");
  }
}

 而list方法对应的代码不用做任何变动（不需要@CrossOrigin注解）