解决document.cookie无法获取到cookie问题

一、前言

在进行前后端联调的时候,由于想实现一个登出操作,前端自动删除浏览器存储的cookie,想通过document.cookie来获取进而进行删除操作,但是发现浏览器有cookie;但是无法获取到情况遂记录

二、场景复现

  1. 首先登录后,浏览器中是有记录cookie的,如图
    在这里插入图片描述
  2. 然后我代码层执行documen.cookie发现获取不到,浏览器控制台也同样
    在这里插入图片描述
  3. 后面去研究了一下application中存放的cookies的属性内容,发现有个属性HttpOnly是选中状态,这个状态是由于后端设置cookie的时候设置了该属性为true导致
//后端代码
public static void addCookie(HttpServletResponse response, String name, String value, String domain, int maxAge) {
    try {
        Cookie cookie = new Cookie(name, URLEncoder.encode(value, "utf-8"));
        cookie.setPath("/");
        cookie.setDomain(domain);
        cookie.setMaxAge(maxAge);
        cookie.setHttpOnly(true);   //后端设置httpOnly属性为true
        response.addCookie(cookie);
    } catch (Exception var6) {
        throw new RuntimeException(var6.getMessage());
    }
}

在这里插入图片描述

  1. 后面我将HttpOnly设置false状态后,documen.cookie就能够获取到
    在这里插入图片描述
  2. 百度查了一下HttoOnly属性的作用,觉得这个博主解释很到位【HttpOnly解答

HttpOnly是2016年微软为IE6而新增了这一属性
HttpOnly是包含在http返回头Set-Cookie里面的一个附加的flag,所以它是后端服务器对cookie设置的一个附加的属性,在生成cookie时使用HttpOnly标志有助于减轻客户端脚本访问受保护cookie的风险(如果浏览器支持则会显示,若不支持则选择传统方式)

  1. 也就是说HttpOnly的存在主要是为了防止用户通过前端来盗用cookie而产生的风险,例如XSS攻击就是对cookie进行盗窃,使用这一属性就可以防止客户端(前端)不可访问
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值