网站首页 > 技术文章 正文
背景 目前正在开发的项目是前后端分离的项目,前端是vue,后端springboot开发的微服务,在调试登录的时候发现,登录成功后把所需的信息都放到session中并存到redis里,但当用户从session中取信息的时候发现始终取不到,每次跨域请求时ajax发送的都是新的sessionid,导致无法获取信息。
解决思路 通过度娘查询发现必须在前后端配置一些东西,后端需在登录拦截器里增加一些响应头信息,前端需要在Ajax请求时增加一些参数。下面是具体的实现过程。
解决过程 登录拦截器
public class LogInterceptor implements HandlerInterceptor {
@Override
public boolean preHandle(HttpServletRequest request,
HttpServletResponse response, Object object) throws Exception {
response.setCharacterEncoding("UTF-8");
response.setContentType("application/json; charset=utf-8");
response.setHeader("Access-Control-Allow-Credentials","true");
response.setHeader("Access-Control-Allow-Origin", request.getHeader("Origin"));
response.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
response.setHeader("Access-Control-Allow-Methods", "GET, HEAD, POST, PUT, DELETE, TRACE, OPTIONS, PATCH");
return true;
}
}
注意:response.setHeader("Access-Control-Allow-Credentials","true"); 这是重点
response.setHeader("Access-Control-Allow-Origin", "*"); 这里不能写成("*")号
配置类
这里拦截登录请求
@Configuration
public class LoginConfig extends WebMvcConfigurerAdapter {
@Override
public void addInterceptors(InterceptorRegistry registry) {
registry.addInterceptor(new LogInterceptor()).addPathPatterns("/login");
super.addInterceptors(registry);
}
}
这里拦截登录请求
修改前端请求 因为前端vue使用的是axios,查看axios的文档发现默认配置里 withCredentials: false,withCredentials默认是false,意思就是不携带cookie信息,我们需要改成 true。 修改前端登录请求的js:
import axios from 'axios';
axios.defaults.withCredentials=true;
大功告成 继续测试发现登录成功后,响应头里有sessionid,并且接下来前端发送请求的时候携带的是同一个sessionid。
猜你喜欢
- 2025-04-09 如何设计一套单点登录系统(如何做单点登录)
- 2025-04-09 精读大型网站架构的技术细节:后端架构规整化Cookie和Session
- 2025-04-09 nginx 前端到底用来做啥(前端放在nginx)
- 2025-04-09 一文助你弄懂cookie、session、token
- 2025-04-09 简单快速搭建一个大模型agent前端
- 2025-04-09 对API网关注册和接入的接口安全管理总结
- 2025-04-09 初识.Net Core Mvc(session 登录+查询)
- 2025-04-09 springcloud实现分布式session(springcloud分布式事务解决方案)
- 2025-04-09 前端开发中实现有效缓存策略的关键要点
- 2025-04-09 Nginx负载均衡中对session处理分析一
你 发表评论:
欢迎- 最近发表
- 标签列表
-
- 前端设计模式 (75)
- 前端性能优化 (51)
- 前端模板 (66)
- 前端跨域 (52)
- 前端缓存 (63)
- 前端react (48)
- 前端md5加密 (49)
- 前端路由 (55)
- 前端数组 (65)
- 前端定时器 (47)
- 前端接口 (46)
- Oracle RAC (73)
- oracle恢复 (76)
- oracle 删除表 (48)
- oracle 用户名 (74)
- oracle 工具 (55)
- oracle 内存 (50)
- oracle 导出表 (57)
- oracle约束 (46)
- oracle 中文 (51)
- oracle链接 (47)
- oracle的函数 (57)
- mac oracle (47)
- 前端调试 (52)
- 前端登录页面 (48)
本文暂时没有评论,来添加一个吧(●'◡'●)