前端Vue设置cookie、删除cookie,获取cookie方式

 更新时间:2022年10月24日 15:43:15   作者:PairsNightRain  
这篇文章主要介绍了前端Vue设置cookie、删除cookie,获取cookie方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

Vue设置cookie、删除cookie、获取cookie

在main.js中如下设置

设置cookie

Vue.prototype.Setcookie = function (name,value) {
  //设置名称为name,值为value的Cookie
  var expdate = new Date();   //初始化时间
  expdate.setTime(expdate.getTime() + 30 * 60 * 1000);   //时间单位毫秒
  document.cookie = name + "=" + escape(value) + ";expires=" + expdate.toGMTString() + ";path=/";
  //即document.cookie= name+"="+value+";path=/";  时间默认为当前会话可以不要,但路径要填写,因为JS的默认路径是当前页,如果不填,此cookie只在当前页面生效!
}

获取cookie

Vue.prototype.getcookie = function (a){
  // console.log(a)
  var d;
  var b = document.cookie;
  // console.log(b)
  var c = b.split(";");
  for (let e = 0; e < c.length; e++) {
    var f = c[e].split("=");
    if (a == f[0].toString().trim()) {
      d = f[1];
      break;
    }
  } if (void 0 == d || null == d) {
    return "";
  }
  else {
    var g = unescape(d.trim());
    return g;
  }
}

删除cookie

Vue.prototype.delCookie= function (a){
      var b = new Date(0).toGMTString();
      document.cookie = a + "=;expires=" + b + ";path=/";
    },

Vue允许跨域携带cookie

import axios from 'axios'
axios.defaults.withCredentials = true;// 允许跨域携带cookie

或者在请求拦截器中添加

config.headers['Access-Control-Allow-Credentials']=true

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • 基于vue.js无缝滚动效果

    基于vue.js无缝滚动效果

    这篇文章主要介绍了一个基于vue.js无缝滚动效果,文中给大家介绍的非常详细,具有参考借鉴价值,需要的朋友可以参考下
    2018-01-01
  • 如何在vue中使用ant-design-vue组件

    如何在vue中使用ant-design-vue组件

    这篇文章主要介绍了如何在vue中使用ant-design-vue组件,本文通过示例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2023-01-01
  • vue-cli-service的参数配置过程

    vue-cli-service的参数配置过程

    这篇文章主要介绍了vue-cli-service的参数配置过程,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-04-04
  • 关于Vue3&TypeScript的踩坑汇总

    关于Vue3&TypeScript的踩坑汇总

    这篇文章主要介绍了关于Vue3&TypeScript的踩坑汇总,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-09-09
  • Vue-cli框架实现计时器应用

    Vue-cli框架实现计时器应用

    这篇文章主要为大家详细介绍了Vue-cli框架实现计时器应用,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-08-08
  • vue中的事件修饰符介绍和示例

    vue中的事件修饰符介绍和示例

    在Vue中,修饰符处理了许多DOM事件的细节,让我们不再需要花大量的时间去处理这些烦恼的事情,而能有更多的精力专注于程序的逻辑处理,需要的朋友可以参考下
    2023-04-04
  • 基于cropper.js封装vue实现在线图片裁剪组件功能

    基于cropper.js封装vue实现在线图片裁剪组件功能

    这篇文章主要介绍了基于cropper.js封装vue实现在线图片裁剪组件功能,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2018-03-03
  • 使用Vue自定义数字键盘组件(体验度极好)

    使用Vue自定义数字键盘组件(体验度极好)

    最近做 Vue 开发,因为有不少页面涉及到金额输入,产品老是觉得用原生的 input 进行金额输入的话 体验很不好,于是自己动手写了一个使用Vue自定义数字键盘组件,具体实现代码大家参考下本文
    2017-12-12
  • 解决vue-cli项目开发运行时内存暴涨卡死电脑问题

    解决vue-cli项目开发运行时内存暴涨卡死电脑问题

    最近开发一个vue项目时遇到电脑卡死问题,突然间系统就非常卡,然后卡着卡着就死机了,鼠标也动不了了,只能冷启动。这篇文章主要介绍了vue-cli项目开发运行时内存暴涨卡死电脑问题,需要的朋友可以参考下
    2019-10-10
  • vue实现简易音乐播放器

    vue实现简易音乐播放器

    这篇文章主要为大家详细介绍了vue实现简易音乐播放器,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-08-08

最新评论