前端为什么取不到后端接口带过来的sessionID的值？

最新推荐文章于 2023-10-23 18:54:02 发布
原创 最新推荐文章于 2023-10-23 18:54:02 发布 · 6.5k 阅读 · 6 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#session #cookie #HTTP

本文详细解析了Cookie的参数及其作用，重点介绍了HttpOnly和Secure属性如何增强安全性，防止XSS攻击，确保sessionID只能由服务端读取，前端无法访问。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

在这里插入图片描述
通过document.cookie拿不到截图中的sessionID；但是能取到csrfTOKEN；

仔细看图
在这里插入图片描述

这个sessionID的HTTP状态打了勾，则表示HttpOnly，当这个值设为true时，浏览器是无法读取这个cookie值的，只有服务端能够读取。前端不能拿取，这是为了防止xss攻击；

尝试修改这个值，之后接口请求都会报错为未登录状态；

所以，这个值是不让在前端getter,setter；

详细的cookie参数如下：

  1. name: cookies的名字，也是cookies的唯一标识，通过他来获取和设置cookies
  2. value：cookies的值，也就是cookies的内容，这是cookies有用的内容
  3. omain：cookies所属的域
  4. Path: cookies所属的路径，他是属于某个路径的，/代表根路径
  5. expires：cookies的到期时间，如果为0则永不过期
  6. http: 如果打钩则通过脚本无法获取，可以防止xss攻击
  7. secure：https连接才会传送该cookies，增强了安全性
  8. sameSite：可选值Strict 和 Lax，Strict 严格模式，不能被第三方网站获取，Lax：宽松模式，可以被第三方获取
Java后端获取sessionId不一致的问题
盛难晨
03-26 3871
出现这个问题，主要的原因就是前端没有将cookie带给后端，或者后端的cookie没有带给前端。所以把这个解决了就基本解决了问题。 后端配置 在后端配置了一个过滤器，也是解决跨域的问题： <!-- 跨域设置 --> <filter> <filter-name>crossFilter</filter-name> ...
Vue3前端 .NET 后端接口【前后端分离】
m0_45894394的博客
09-26 1549
使用VsCode搭建Vue3前端项目及配置 后端使用Vistual Studio2022 搭建接口项目， 数据库语言为mysql 数据库工具使用DataGrip进行可视化，后端接口模式为 mvc ，使用前后端分离的模式进行一个简单登录的实现
前后端访问，session中的值获取不到​​​​​​​
Jhang_song的博客
05-30 1247
session中的值获取不到​​​​​​​
Django session 详解-part II-session
weixin_33712987的博客
08-18 323
2019独角兽企业重金招聘Python工程师标准>>> ...
前端获取不到后台数据的解决办法
qq_52117632的博客
02-13 3513
前端获取不到后台数据的解决办法
解决前端ajax跨域请求不携带cookie信息JSESSIONID的问题
我驾驶汽车从不是为了从A点到达B点，我喜欢去感受汽车，与之交流，与之融为一体。
02-19 5593
xhrFields: { withCredentials: true, //解决跨域问题 credentials: 'include',//解决前端加入Cookie请求头的问题 },
（黑马点评项目）idea工具Debug启动，前端调用接口请求session拿不到值问题（排查问题复盘）
ggjklncffd的博客
10-10 932
问题：就在昨晚做了一个小功能，通过session将值保存到Cookie中实现用户的登录，但是在用Debug启动走断点的时候发现session能保存进去，但是调用login接口是却拿不到值，一直为null,（日志输出为null）但是run启动就能拿到值，成功登录，（日志输出有值）
layUI实现前端分页和后端分页
10-16
"sessionId": sessionId1, "token": token2 } }; // 发送POST请求 $.ajax({ type: "POST", dataType: 'json', url: UserListPaged, // 后端接口地址 data: dd, headers: { 'X-Requested-With': '...
问题与解决：用 jQuery Ajax 发送请求，后端获取 session 为空
si_ying的博客
05-30 1933
最近在做错题集的 web 开发课程设计，根据以往的经验前端和后端的数据我大部分都在用 session 进行传输。最近刚学习并运用了 Ajax 技术，当我像以前一样在后端更新session时，发现前端没有获取新的session数据，由此我打算认真来学习一下session，顺便将已有的项目整理一下。 希望路过的大佬们可以指点一二，同时也希望给遇到同样困惑的小伙伴提供帮助🙂
从0到1使用NodeJS编写后端接口的实战案例（仅供参考）
不怕麻烦的鹿丸的博客
06-18 7995
基于vue和node.js来开发的一个在线商城管理系统。
Session在前端页面无法传递的原因及解决方法
m0_45224224的博客
10-28 1517
如何让session在多个前端页面之间进行传递
后端接收不到前端传的id值
weixin_48321061的博客
08-24 1705
int值包在对象里传到后端为null axios默认请求头是 Cont-Type:aapplication/json;charset=utf-8。当请求头为Content-Type: application/x-www-form-urlencoded 的时候，参数传对象并且对象里面有int值时就会出现传到后端的int为null。 这时候需要使用qs插件解决。 qs的使用方法 qs.parse()：把URL解析成对象 qs.stringify()：把对象序列化成URL，并以&进行拼接 下载 npm i
已解决：在js获取不到session问题
dchao
05-12 3817
js获取不到session的问题： var name = '<%=session.getAttribute("name")%>'; alert(name); 这里直接alert了<%=session.getAttribute(“name”)%>，哈哈哈哈卧槽，太真实了。 原因：<%=%>的方式是表示中间的代码为后台代码，不是在js中获取后台变量的值...
解决：update更新用户锁定状态时，前端给后端的用户id与数据库实际用户id不符，造成无法更新用户状态问题
m0_66343205的博客
08-25 1073
前端后进行数据交互时，由于数据类型造成的精度缺失问题的解决。 springmvc消息对象转换器/消息转换器。
前后端分离获取不到session里的值_SpringBoot2.0实战（27）整合SpringSecurity前后端分离Token鉴权...
weixin_32204235的博客
02-03 1000
通过前一篇文章，我们已经实现了前后端分离模式下，使用JSON数据进行前后端交互第二十四章：整合SpringSecurity之最简登录及方法鉴权第二十五章：整合SpringSecurity之使用数据库实现登录鉴权第二十六章：整合SpringSecurity之JSON格式前后端交互主要涉及到实现 AbstractAuthenticationProcessingFilter 接口，接收JSON格式登录表...
Springboot+vue跨域+登录拦截问题,前端获取不到session,每次请求sessionid变化
qq_39743892的博客
10-23 3110
为了解决这个问题,狠狠的恶补了浏览器相关方面的知识,发现虽然访问了页面,获得了数据,但访问前端的网址,浏览器里并没有cookie记录以及session记录,得出结果,问题在于登录上.在f12的network中仔细排查后发现,默认的主页虽然获取到了信息,但是没cookie记录,而每点一次登录,登录的请求头中的cookie存的sessionid都不一样.//允许所有的请求类型。配置了cros后,前端能成功接受到数据,本以为皆大欢喜了,但是后端做了登录拦截后,发现所有拦截的页面都报跨域错误,而取消拦截后正常.
解决跨域问题
xzh_blog
11-07 1208
import org.springframework.context.annotation.Bean; import org.springframework.context.annotation.Configuration; import org.springframework.web.cors.CorsConfiguration; import org.springframework.web....
document.cookie无法获取到cookie
前端踩坑之路
07-29 7487
背景 在前后端联调的时候，后端需要在入参中传入 cookie。于是想通过 document.cookie 来获取，但是发现浏览器有 cookie 但是无法获取到。 场景复现 打开谷歌调试工具，可以看到浏览器中是有记录 cookie 的； 在控制台执行 documen.cookie 发现获取不到 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Qrm2NS3T-1627532987813)(https://raw.githubusercontent.com/AprilTong/
前端调用接口导致后端sessionid不一致为什么
最新发布
03-22
<think>嗯，用户的问题是关于前端调用接口时导致后端Session ID不一致的原因。首先，我需要根据提供的引用资料来分析可能的原因。 根据引用[1]和[2]，用户提到在前端用JavaScript请求时Session ID会变，但直接浏览器访问时正常。这可能和浏览器的同源策略或者跨域请求有关。如果前端和后端不在同一个域下，跨域请求可能不会自动携带Cookie，导致每次请求都生成新的Session ID。 引用[3]中提到，使用Ajax请求时没有携带服务器返回的Session ID，而Swagger测试时正常。这可能是因为Ajax请求默认不会携带Cookie，需要设置withCredentials为true。同时，后端也需要配置CORS允许携带凭证，比如Access-Control-Allow-Credentials头。 引用[4]指出Session认证依赖于客户端发送Session ID，通常存放在Cookie中。如果前端没有正确处理Cookie，或者在请求中没有包含这个Cookie，就会导致Session ID不一致的问题。例如，前端框架如Axios可能需要配置才能自动发送Cookie。 引用[5]的例子是前端Vue调用后端ThinkPHP接口，可能需要检查Axios的配置是否正确，比如baseURL是否正确，是否设置了withCredentials，以及后端是否正确设置了CORS策略。 可能的原因还包括：前端未启用Cookie、跨域请求未处理、后端Session存储问题、前端框架配置错误等。需要逐一排查这些可能性，比如检查请求头是否包含Cookie，后端是否返回Set-Cookie头，以及网络环境是否有代理干扰等。</think>### 前端调用接口导致后端Session ID不一致的原因分析 #### 1. **跨域请求未携带Cookie** - **问题描述**：若前端与后端部署在不同域名或端口下，浏览器默认出于安全策略（同源策略）会**禁止跨域请求自动携带Cookie**，包括Session ID。此时每次请求会被视为“新会话”，导致Session ID不一致[^3][^4]。 - **验证方法**：检查请求头中是否包含`Cookie`字段，若缺失则说明未携带Session ID。 - **解决方案**： - 前端设置：在Ajax请求（如Axios）中需显式启用`withCredentials`属性： ```javascript axios.post('/api/login', data, { withCredentials: true }); ``` - 后端设置：添加CORS响应头允许凭证： ```http Access-Control-Allow-Origin: [具体域名] // 不可为通配符* Access-Control-Allow-Credentials: true ``` #### 2. **前端未正确处理Set-Cookie** - **问题描述**：后端返回的`Set-Cookie`响应头若未正确存储到浏览器，后续请求将无法携带Session ID。常见于以下场景： - 浏览器安全设置（如禁用第三方Cookie） - Cookie的`SameSite`属性限制（默认`Lax`会阻止部分跨站请求携带Cookie）[^4] - **验证方法**：检查浏览器开发者工具中**Network → Response Headers**是否包含`Set-Cookie`，并观察后续请求是否携带。 #### 3. **前后端部署路径不一致** - **问题描述**：若前端页面部署在子路径（如`/app`）而后端接口在根路径（如`/api`），Cookie的`Path`属性可能限制其作用范围，导致Session ID无法传递。 - **解决方案**：后端显式设置Cookie的`Path`属性为根路径： ```http Set-Cookie: sessionid=abc123; Path=/; HttpOnly ``` #### 4. **服务器Session存储配置问题** - **问题描述**：后端未正确配置Session存储机制（如未持久化到数据库或Redis），导致重启后Session丢失，或负载均衡场景下未共享Session。 - **解决方案**：检查后端Session存储配置，确保多实例间共享Session数据。 --- ### 排查流程 1. **检查请求头与响应头** - 使用浏览器开发者工具，观察请求是否携带`Cookie: sessionid=xxx`，响应是否包含`Set-Cookie`。 2. **验证CORS配置** - 确保后端返回的`Access-Control-Allow-Origin`为具体域名且包含`Access-Control-Allow-Credentials: true`。 3. **代码检查** - 前端确认`withCredentials: true`已启用，后端检查Session存储逻辑和Cookie属性设置。 --- ### 示例代码（后端CORS配置） ```python # Flask示例 from flask import Flask from flask_cors import CORS app = Flask(__name__) CORS(app, supports_credentials=True, origins=["http://frontend-domain.com"]) ``` ---
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值