cookie 在工作中比较常用, 可以自行封装一些 添加/删除/获取cookie的方法, 可参考这个

在Vue中有个很好用的插件 vue-cookies

github地址：https://github.com/cmp-cc/vue-cookies

我们具体来看下怎么使用这个插件的使用

第一步：安装vue-cookie

npm install vue-cookie --save

(a). 默认值设置

$cookies.config(expireTimes[,path[, domain[, secure[, sameSite]]])

默认: expireTimes = 1d, path = '/', domain = '', secure = '', sameSite = ''

expireTimes: 有效期 默认1d

path: cookie 存放的路径 默认 '/'

domain: cookie所在的域，默认为请求地址

secure: cookie只能用https协议发送给服务器

sameSite: 用来限制第三方 Cookie，从而减少安全风险, 可以设置三个值。

. Strict: 最为严格，完全禁止第三方 Cookie，跨站点时，任何情况下都不会发送 Cookie。换言之，只有当前网页的 URL 与请求目标一致，才会带上 Cookie。

这个规则过于严格，可能造成非常不好的用户体验。比如，当前网页有一个 GitHub 链接，用户点击跳转就不会带有 GitHub 的 Cookie，跳转过去总是未登陆状态。

. Lax: 规则稍放宽，大多数情况不发送第三方 Cookie，但导航到目标网址的 Get 请求除外。

导航到目标网址的 GET 请求，只包括三种情况：链接，预加载请求，GET 表单

设置了Strict或Lax以后，基本就杜绝了 CSRF 攻击。当然，前提是用户浏览器支持 SameSite 属性。

. None: 网站可以选择显式关闭SameSite属性，将其设为None。不过，前提是必须同时设置Secure属性(Cookie 只能通过 HTTPS 协议发送)，否则无效。

(b). $cookies.set方法

$cookies.set(key, value[, expireTimes[, path[, domain[, secure]]]])

key : cookie名

注意 $cookies key 不能是 ['expires', 'max-age', 'path', 'domain', 'secure']

value : cookie值, vue-cookie 会自动帮你把对象转为:

json if (value && value.constructor === Object ){

value = JSON.stringify(value)

}

expireTimes : cookie有效时间，默认时间为1d

可为到期时间点(expire=) [Date]，也可为有效时间段单位s(max-age=)[Number]，

传入Infinity||-1被认该cookie永久有效，

传入0 会被判断为false导致取默认值，

传入非-1 的负数会立即删除该cookie，

传入String类型但又不会被正则匹配的('0'、'abc'、'Session')则关闭浏览器的时候销毁cookie(Expire/Max-Age=Session)，效果类似Session。

path : cookie所在目录，默认 '/' 根目录

设置 path: '/projectName' 指定项目名下 '/projectName' 使用

domain : cookie所在的域，默认为请求地址

secure : Secure属性是说如果一个cookie被设置了Secure=true，那么这个cookie只能用https协议发送给服务器，用http协议不发送

第二步：在 mian.js 引入和通过 Vue.use() 明确地安装

在 main.js 中引入

// es6 方法

import Vue from 'Vue'

import VueCookie from 'vue-cookie'

Vue.use(VueCookie) // 挂在在全局

第三步：在组件中使用

添加 cookie

this.$cookie.set('test', 'Hello world!', 1);

获取cookie

this.$cookie.set('test', 'Hello world!', 1); // return value

删除cookie

this.$cookie.delete('test');

检测是否有key cookie

$cookies.isKey(key) // return true or false

列出所有cookie

$cookies.keys() // return ['key', 'key', ......]