Vue使用cookie和session

  • Z时代
  • 2024-01-10
  • 分类：综合

vue

　　Vue使用cookie和session

一：cookie和session

　　为了防止数据运输或存储终端，特地设置了cookie和session，他们其实都是将数据存储当地。

　　cookie数据保存在客户端，session数据保存在服务器端

　　所以一般session的使用会比cookie的使用会更加安全， 将登陆信息等重要信息存放为SESSION;其他信息如果需要保留，可以放在COOKIE中。 防止服务器端数据泄露，当然，同时session的高安全与高访问量也会导致服务器性能占比也会大很多。

 

二：vue使用cookie

//1.引入cookie依赖
npm install vue-session/vue-cookies --save
​
//2.给main.js配置使用：
import Vuecookie/Vuesession from \'vue-cookie/vue-session\'
Vue.use(Vuecookie/Vuesession)
​
//3.使用：
this.$session.set("key",value);//创建session，或者再加一个表示持续时间的参数
this.$session.get("key");//获取session对象

三：Vue-cookie处理cookie

 

//1.同上导入依赖
//2.配置main.js
import cookie from \'vue-cookie\'
Vue.prototype.$cookie=cookie//创建本地cookie
​
//3.组件当中使用：
create(){this.$cookie.set(\'token\',"asdasd")}
mouted(){this.$cookie.get(\'token\')}
destory(){this.$cookie.delete(\'token\')}
​
//4.设置到期时间：
    this.$cookies.config(\'固定时间\') //填的值1d为一天,1h为一小时,1min为一分钟,1s为1秒
    //指定时间
    this.$cookies.config(new Date(2020,12,1))
    this.$cookies.config("Sat, 13 Mar 2017 12:25:57 GMT")
​
    //不写过期时间，默认为1天过期
    this.$cookies.set("user_session","25j_7Sl6xDq2Kc3ym0fmrSSk2xV2XkUkX")

四：cookie参数：

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

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

  1. key : cookie名

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

    json if (value && value.constructor === Object ){
        value = JSON.stringify(value)
    }

  3. 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。

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

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

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

以上是 Vue使用cookie和session 的全部内容， 来源链接： utcz.com/z/379460.html

回到顶部