js获取cookie获取不到问题 vue获取cookie以及获取不到问题

待我称王封你为后i 2021-07-24 19:57 1842阅读 0赞

1.下载依赖包

npm i js-cookie -S

2.在使用cookie的页面上进行引入

import Cookies from 'js-cookie'

3.使用

*  创建一个在整个网站上有效的Cookie
 *  `Cookies.set('name', 'value');`
 *  创建一个从现在起7天后过期的cookie，在整个站点上有效：
 *  `Cookies.set('name', 'value', { expires: 7 });`
 *  创建一个过期的cookie，对当前页面的路径有效：
 *  `Cookies.set('name', 'value', { expires: 7, path: '' });`
 *  读取cookie：
 *  `Cookies.get('name'); // => 'value' Cookies.get('nothing'); // => undefined`
 *  阅读所有可见的Cookie
 *  `Cookies.get(); // => { name: 'value' }`
 *  删除cookie：
 *  `Cookies.remove('name');`
 *  删除对当前页面路径有效的cookie：
 *  `Cookies.set('name', 'value', { path: '' }); Cookies.remove('name'); // fail! Cookies.remove('name', { path: '' }); // removed!`  
    重要！删除cookie时，您必须传递用于设置cookie的完全相同的路径和域属性，除非您依赖于默认属性。  
    注意：删除未存在的cookie不会引发任何异常，也不会返回任何值

4.针对浏览器存在cookie，前端却获取不到的问题：

*  httpOnly默认为true打对号√情况下，禁止javascript操作cookie，导致获取不到，可以让后端设置false；![List item][]
 *  后端使用node+koa，种客户端一个cookie，但是在客户端内通过document.cookie获取不了此cookie。经查是由于koa通过ctx.cookies.set(name, value, \[options\])种的cookie是自动默认带httpOnly的，httpOnly是服务器可访问 cookie, 默认是 true。禁止javascript操作cookie（为避免跨域脚本(xss)攻击，通过javascript的document.cookie无法访问带有HttpOnly标记的cookie。）  
    所以通过在后端设置ctx.cookies.set(name, value, \{httpOnly:false\})关掉httponly即可。

[List item]: /images/20210724/098d5a48c3b14d2da7ddbdcda4e55d2a.png