vue-cookies使用方法,vue中使用获取cookie

1.安装vue-cookies

npm install vue-cookies -S

2.在main.js引入

import VueCookies from "vue-cookies";
Vue.use(VueCookies);

如图:
在这里插入图片描述

3.在vue组件中使用(如果存入的是对象,需要先转换为json字符串)

设置cookies

this.$cookies.set('fileInfoId', to.query.fileInfoId)

如果是在某个js,例如router.js下使用,如下引入使用即可

import cookies from "vue-cookies";
cookies.set('fileInfoId', to.query.fileInfoId)

在这里插入图片描述

4.获取cookies

this.$cookies.get('fileInfoId')

5.删除cookies

 this.$cookies.remove('fileInfoId');

6.查看cookies

this.$cookies.isKey('fileInfoId')        // return false or true

7.获取所有cookies

this.$cookies.keys()  // return a array

8.针对浏览器存在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即可。

js-cookie参考

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/403806.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

认识repo

任何一个学习Android开发的开发者如果想要深入学习Android,一定要看Android源码,网上关于下载Android源码的教程有很多,如果你已经翻墙了,你可以直接参考Google官网的教程或者老罗最新出的教程,如果你还没有翻墙&#…

python多线程编程(6): 队列同步

From: http://www.cnblogs.com/holbrook/archive/2012/03/15/2398060.html 前面介绍了互斥锁和条件变量解决线程间的同步问题,并使用条件变量同步机制解决了生产者与消费者问题。 让我们考虑更复杂的一种场景:产品是各不相同的。这时只记录一个数量就不…

python多线程编程(7):线程间通信

From: http://www.cnblogs.com/holbrook/archive/2012/03/21/2409031.html 很多时候,线程之间会有互相通信的需要。常见的情形是次要线程为主要线程执行特定的任务,在执行过程中需要不断报告执行的进度情况。前面的条件变量同步已经涉及到了线程间的通…

vue本地下载文件,解决ie浏览器本地下载文件无反应(已解决);vue-cli2本地下载文件,vue-cli3本地下载文件

1.vue-cli2vue 注意&#xff1a;vue-cli2本地文件需要放在静态文件static下<a href"javascript:void(0);" click"download">帮助文档</a>download(){axios.get(static/export.pdf, {responseType: blob, //重要}).then(response > {//判断…

CSS position 笔记+实验

目录&#xff1a;1.static2.relative3.absolute4.fixed5.实验&#xff1a;static, relative, absolute中&#xff0c;父元素-子元素高度关系6.z-index7.参考资料1.static默认的定位方式&#xff0c;不支持设置位移属性用来覆盖之前创建的 absolute, relative, fixed 2.relative…

python多线程编程(8):线程的合并和后台线程

From: http://www.cnblogs.com/holbrook/archive/2012/03/21/2410120.html 线程的合并 python的Thread类中还提供了join()方法&#xff0c;使得一个线程可以等待另一个线程执行结束后再继续运行。这个方法还可以设定一个timeout参数&#xff0c;避免无休止的等待。因为两个线…

学习进度条10

学习进度条 第 十一 周 星期一 星期二 星 期 三 星期四 星期五 星期六 所花时间 90 100 50 42 代码量 0 120 博客量 1 1 1 了解到的知识点 初次了解到典型用户和场景 进行对自己模块设定典型用例 复习了…

批量同时创建邮箱和AD账户

前面我写了关于批量创建AD账户的BLOG,http://mcmvp.blog.51cto.com/5497438/959289也写了用UI批量启用邮件的方法&#xff0c;http://mcmvp.blog.51cto.com/5497438/959314但是这还是要执行两步&#xff0c;我们能不能只要执行一下&#xff0c;AD账户建立成功&#xff0c;邮箱跟…

ant design vue中通知提醒框Notification的使用

效果&#xff1a;点击接口&#xff0c;出现提示弹框&#xff0c;数据获取到后在消失 <template><a-button type"primary" click"openNotification">Open the notification box</a-button> </template> <script> const clo…

Cocos2d-3.x目录介绍分析

一、下载cocos2d的框架 1.下载地址&#xff1a;http://www.cocos2d-x.org/download/version#Cocos2d-x 我们还是选择v3.11吧 比较新的框架 2.下载之后解压这个文件夹就可以了 cocos2d-x-3.11.zip这使我们下载的文件 解压之后&#xff1a; 3. 文件夹目录如图 接下来我们逐步来介…

Mongodb Replica Configure

Mongodb Replica Configure我在配置replica的时候&#xff0c;文档中也把官网的中一些重要解释放在里面了但是并没有用中文做必要的解释&#xff0c;不过都是很容易理解的。说一下环境&#xff0c;这里的环境是&#xff1a;system:centos 64bit 生产环境不用说&#xff0c;直接…

linux字符设备驱动之字符之异步通知

在前面的博文中记录的都是应用层主动查询读取驱动按键状态。驱动可不可以在有信号之后&#xff0c;主动上报通知应用层事件呢&#xff1f;当然可以&#xff0c;linux如此博大精深。我们使用异步通信机制&#xff0c;signal的办法实现该功能。 所谓的异步&#xff0c;就是进程可…

【Linux开发】linux设备驱动归纳总结(二):模块的相关基础概念

linux设备驱动归纳总结&#xff08;二&#xff09;&#xff1a;模块的相关基础概念 系统平台&#xff1a;Ubuntu 10.04 开发平台&#xff1a;S3C2440开发板 xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx 一。初探linux内核模块 内…

2020-12-24

console.log()&#xff0c;对于一般对于基本类型number、string、boolean、null、undefined 的输出是可信的。但对于Object 等引用类型来说&#xff0c;则就会出现上述异常打印输出。&#xff08;调试复杂数据类型时候通过打断点来看即可&#xff09; 正常预期 <script>…

XAML实例教程系列 - 资源(Resources)

在Windows 8 Metro应用开发中&#xff0c;XAML主要用于应用界面设计&#xff0c;无论是开发人员还是设计人员经常会设计自定义用户界面或者控件行为&#xff0c;其中会涉及到不同方面的代码设计&#xff0c;例如控件模板&#xff0c;控件样式&#xff0c;动画设计等。为了方便设…

解决vue的滚动条监听事件无效 解决vue的滚动条scrollTop距离总是为0无效问题

话不多说 直接上代码&#xff08;方法可以直接复制拿去&#xff0c; html部分需要改成你的元素的ref和点击回到顶部的方法名称&#xff09; html <section ref"scrollbox" class"inner-body"><div>这里放了很多内容 出现了滚动条</div&g…

装载问题

1、回溯法 (1)描述:回溯法是一种选优搜索法&#xff0c;按选优条件向前搜索&#xff0c;以达到目标。但当探索到某一步时&#xff0c;发现原先选择并不优或达不到目标&#xff0c;就退回一步重新选择&#xff0c;这种走不通就退回再走的技术为回溯法。 (2)原理: 回溯法在问题的…

android开发(13) 尝试在流布局中移动控件

我们常用的linearlayout,等都属于流布局&#xff0c;在流布局中如何移动控件呢&#xff1f; 我决定做个尝试。虽然可以使用绝对布局&#xff0c;但我不倾向使用这个布局。那么看看我的方式吧。 记得margin这个属性吗&#xff0c;我们就用来它来控制控件的位置&#xff0c;改动它…