使用js-cookie调用Cookies.get()返回undefined，仅httpOnly为false时可读取是何原因？

核心原因 #

这是HttpOnly Cookie 属性的原生安全设计，并非代码或 js-cookie 库的异常：

• 被标记为HttpOnly的 Cookie，浏览器仅允许其在 HTTP/HTTPS 请求传输时自动被携带，完全禁止所有客户端侧 JavaScript 访问（包括读、写、删除操作），这个设计的核心目的是防范 XSS 攻击窃取敏感身份凭证。
• 当你把HttpOnly设为 false 后，Cookie 就没有了这层访问限制，js-cookie 自然可以正常读取到 token 的值。

你当前代码中Cookies.get()返回 undefined 完全符合 HttpOnly Cookie 的安全规则。

场景优化建议 #

如果你的token是用于身份鉴权，更建议保留HttpOnly属性提升安全性，不需要前端读取 token：

• 给你的请求库（axios/fetch 等）开启携带凭证配置，以 axios 为例：axios.defaults.withCredentials = true，浏览器会自动在所有请求中携带HttpOnly的 token Cookie，不需要你手动读取后塞到请求头里。
• 你现有代码中不需要调用Cookies.get('token')拿值再传给CheckAuth，直接调用CheckAuth()即可，请求自动携带 Cookie 完成鉴权。

现象截图 #

内容的提问来源于stack exchange，提问作者Zulfikar Ahmad