vue.js+springboot前后端分离，跨域不同请求时sessionId不一致问题解决方法

第一步：先解决不允许跨域请求的问题，vue.js使用的端口是8080，springboot后台使用的端口是8081，当前端调用后台http://localhost:8081的接口，会报不允许跨域请求方法的403错误，因此需要编写一个配置类解决跨域调用接口的问题。

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;


@Configuration
public class CorsConfig {
    private CorsConfiguration buildConfig() {
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        corsConfiguration.setAllowCredentials(true);
        corsConfiguration.addAllowedOrigin("http://localhost:8080"); // 允许任何域名使用
        corsConfiguration.addAllowedHeader("*"); // 允许任何头
        corsConfiguration.addAllowedMethod("*"); // 允许任何方法（post、get等）
        return corsConfiguration;
    }

    @Bean
    public CorsFilter corsFilter() {
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", buildConfig()); // 对接口配置跨域设置
        return new CorsFilter(source);
    }
}

第二步：在vue.js的main.js文件中增加需要使用的axios全局配置

import Axios from 'axios'
Axios.defaults.withCredentials=true;

vue跨域请求拿到的session每次都不一样，这样就不能实现登录状态的保存，加上Axios.defaults.withCredentials=true;这句代码，让每次请求都带上cookie,这样每次取请求后端,就不会被认为是不同用户导致session丢失

在控制台输出获取验证码图片与登录操作中HTTPSession对象的sessionId，发现一致，可以解决跨域请求sessionId不一致的问题。

内容参考：

https://blog.csdn.net/weixin_34249367/article/details/94300572

https://blog.csdn.net/qq_35493664/article/details/83502472