SpringBoot + VUE 解决后台的 session 的 null 的问题

最新推荐文章于 2024-11-03 20:04:28 发布

原创最新推荐文章于 2024-11-03 20:04:28 发布 · 1.4k 阅读

7 ·

CC 4.0 BY-SA版权

文章标签：

#vue #session #springboot

Vue 专栏收录该内容

5 篇文章

订阅专栏

本文主要介绍了前端跨域访问后端接口时遇到的sessionID不一致问题，导致无法获取session内容。解决方案是在vue中全局设置axios的withCredentials为true，允许携带cookie，同时在后端配置WebMvcConfigurer，允许跨域并设置允许携带证书。经过这些处理，确保了跨域请求时sessionID的一致性，从而能正常获取session信息。

问题原因

前端跨域访问后端接口, 在浏览器的安全策略下默认是不携带cookie的, 所以每次请求都开启了一次新的会话.
在后台打印sessionID我们会发现, 每次请求的sessionID都是不同的, 既然每次请求都是一个新的会话, 那我们去获取session的时候自然就是null了.

前端处理

在 vue 中所有引入 axios 的地方添加如下代码，允许跨域携带cookie

import axios from 'axios'
axios.defaults.withCredentials = true     // 添加代码：允许跨域携带cookie

后端处理

新建 WebAppConfig ，实现 WebMvcConfigurer 接口，允许前端跨域

public class WebAppConfig implements WebMvcConfigurer {
    //前端跨域
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")//设置允许跨域的路径
                .allowedOrigins("*")//设置允许跨域请求的域名
                .allowCredentials(true)//是否允许证书 不再默认开启
                .allowedMethods("GET", "POST", "PUT", "DELETE")//设置允许的方法
                .maxAge(3600);//跨域允许时间
    }
}

问题解决, 重启工程后我们再次打印每次请求的sessionID就会发现sessionID是一致的, 当然也就可以获取我们存入session的内容了.