SpringBoot工程解决跨域问题

SpringBoot + vue axios 前后端工程解决跨域问题

使用场景: 常用于前后端联调过程中，出现接口访问跨域问题，至于跨域的原理，这里不做细说，自行百度，解决方法如下

1.添加配置类

package com.xy.quickapp.enterprise.config;

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

/**
 * Created by kang.zou
 * on 2020/2/21
 */
@Configuration
public class SpringMvcConfig implements WebMvcConfigurer {

    /**
     * 设置前后端跨域
     * @return
     */
    @Bean
    public WebMvcConfigurer webMvcConfigurer2(){
        return new WebMvcConfigurer() {
            /**
             * 设置头 使可以跨域访问
             * @param registry
             * @since 4.2
             */
            @Override
            public void addCorsMappings(CorsRegistry registry) {
                registry.addMapping("/**")
                        .allowedOrigins("*")
                        .allowedMethods("*")
                        .allowedHeaders("*")
                        .maxAge(3600)
                        .allowCredentials(true);
            }
        };
    }
}

allowOrigins （允许哪些资源访问）可以从配置中读取，这样方便维护
allowCredentials(允许cookie、session跨域)

2.前端vue项目中axios中设置

2.1 main.js中设置
Vue.prototype.$axios = axios
axios.defaults.withCredentials =true;

2.2 axios单独设置
withcredentials:true