SpringBoot两种跨域访问处理方式

很多前端开发，像VUE，Angular这些，在开发过程中都是独立服务运行，不是一个简单的HTML+js文件，所以就会出现跨域请求问题，要么前端处理，要么后台处理，不过往往前端处理会麻烦很多。这里介绍两种SpringBoot的处理方式。
首先，我使用的是vue的Axios进行请求：

 methods: {
      testGet: function () {

        var url = 'http://192.168.6.106:8090/getuserlist'
        Axios.get(url).then(res => {
          console.log(res)
        }).catch(error => {
          console.log(error)

        })

      }
    }

在没处理跨域的时候，请求返回的信息是这样的

image.png

OK，下面进行跨域处理。

第一种方式，重写跨域请求接口

找到入口文件，xxxApplication.java，在main函数后面加上以下这段代码

   @Bean
   public WebMvcConfigurer corsConfigurer() {
      return new WebMvcConfigurer() {
           @Override
            public void addCorsMappings(CorsRegistry registry) {
              registry.addMapping("/**")   //映射路径
                        .allowedOrigins("*")//允许访问所有域
                        .allowCredentials(true)//cookie信息
                       .allowedMethods("GET","POST", "PUT", "DELETE")//请求类型
                       .allowedHeaders("*")//允许请求的头部列表，允许所有
                        .exposedHeaders("Header1", "Header2");//暴露的请求头部信息
            }
      };
    }

再次请求。返回结果为

image.png

第二种方式，注解大法

我发现我个人比较喜欢注解，不是很喜欢xml之类的，哎。。。。。
打开映射地址的Class，在头部加入注解,like me

@RestController
@CrossOrigin(origins = "*",allowedHeaders = "*",exposedHeaders = "Header1,Header2",allowCredentials = "true")
public class UserController {

看不明白，这个更直观

image.png

然后在请求一遍

image.png
就是这么简单。