js来读写cookie操作

因为之前公司的项目前后端是在一起的,因为要用vue来重构之前的项目。所以token签名要作为一个参数传递到后台。所以就遇到两个问题,1 token的保存和获取的问题。 2 token 判断。判断用户是否用token值。

首先先说一下 token的保存和获取问题。

保存到哪?随着H5的普及相信大家也都知道本地存储,包括我自己在开发的时候也是也是经常用到本地存储的东西。所以我首先想到的就是本地存储。另外想到就是用cookie来存储。在调研这个东西的时候就了解到国内的某大互联网公司,他们的做法是在登陆的时候会下载一个安全的插件在本地。然后这个用户信息都是存储在本地的,所以可以跨引用去读取,比如从浏览器跨到桌面应用。因为都是取的本地的东西,就像一个中转站。

相信本地存储的操作大家都会不在具体阐述,先说一下本地存储中遇到的问题。右键打开新连接(如下图操作)

 

在新连接的打开页面中,要重新登陆。相信大家都不想再次登陆吧,这样体验会很不友好。然后发现本地存储的东西都是只有在当前页面的当前域名下。所以只能存在cookie里面了,cookie里面不会出现这个问题。具体要说cookie的涉及的内容较多详细信息就不再多说,下面只说一下js来控制cookie的操作。

  1 设置cookie

document.cookie="name="+username;

例如 document.cookie="access_token=" + val;

2 读取(在控制台里面 直接输入 document.cookie 就可以返回 该域名下的 cookie 信息,就是字符串,也就是说js进行字符串操作)

function getCookie(name)
{var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");if(arr=document.cookie.match(reg))return unescape(arr[2]);elsereturn null;
}
3 删除

//获取当前时间 
var date=new Date(); 
//将date设置为过去的时间 
date.setTime(date.getTime()-10000); 
//将userId这个cookie删除 
document.cookie="name=val; expires="+date.toGMTString(); 

判断用户是否有token,是在路由里面去判断,也就是在拦截的时候去判断是否有token。




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

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

相关文章

MUI tab选项卡之间的切换和数据获取

查看mui官网上面的例子&#xff0c;会看到有多种tab 选项卡的例子&#xff0c;我就写下我用到的tab选项卡。写了个简单的例子&#xff0c;效果如下图 主页面的代码 <nav class"mui-bar mui-bar-tab"><a class"mui-tab-item mui-active" href"…

ECharts 联动效果

在使用ECharts 时候要用到联动的&#xff0c;比如下面的示例图&#xff0c;当鼠标经过A的图的时候&#xff0c;这个时候有提示&#xff0c;然后让B的提示也显示出来。这样一个效果。 官方文档给的配置项&#xff0c; http://echarts.baidu.com/api.html#echarts.connect var my…

Git Permission to fazhiyun86/Test.git denied to MarRoar

先说明问题。在我的电脑上有两个SSH key&#xff0c;也就是有两个GitHub账户。我们在GitHub账户里面配置好 SSH key 的时候&#xff0c;就可以向自己的GitHub账户的仓库里面push 代码。 我们先在第一个账户push 代码的时候会让输入 用户名和密码。当向另一个账户push 东西的时…

ECharts 饼图 legend 样式修改

在移动端展示一个数据很多的饼图的时候&#xff0c;首先看一下效果。ECharts legend 配置项 1 legend 让它在右面竖着显示。 legend: {type: scroll,orient: vertical,show: true,right: 0,top: 20,bottom: 20,textStyle: {fontSize: 7},formatter: function (name) {return (n…

ECharts 仪表盘的轴线宽度修改

今天修改仪表盘的轴线宽度&#xff0c; 配置项链接。修改的是下图中线框标注地方的宽度。 下面看一下配置项 option {tooltip : {formatter: "{a} <br/>{b} : {c}%"},toolbox: {feature: {restore: {},saveAsImage: {}}},series: [{name: 业务指标,type: gau…

CSS 让数字滑动显示

最近在做一个数据展示的页面&#xff0c;老板想要的效果是数字滑动的显示。 所以想了一下实现了老板想要的效果。代码如下。 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>number</title><…

Status Code:200 OK (from disk cache)和304的区别,以及怎么禁止缓存

有时候缓存是 200 OK (from disk cache)有时候会是 304 ? 看运维是否移除了 Entity Tag。移除了&#xff0c;就总是 200 OK (from cache)。没有移除&#xff0c;就两者交替出现。 他们两个的区别是 200 OK (from disk cache) 是浏览器没有跟服务器确认&#xff0c; 就是它直接…

js 排序

冒泡排序 var dataStore [ 72 , 1 , 68 , 95 , 75 , 54 , 58 , 10 , 35 , 6 , 28 , 45 , 69 , 13 , 88 , 99 , 24 , 28 , 30 , 31 , 78 , 2 , 77 , 82 , 72 ];var t bubbleSort(dataStore);console.log(t);function bubbleSort(data) {var temp 0;for (var i 0; i < dat…

js 类型判断

说到js的类型判断很容易想到的是 typeof、instanceof等。 typeof 有个缺点就是引用类型的结果值都是object 所以就要说一下这些类型是怎么判断的。在说类型判断之前先介绍个东西 Object.prototype.toString 可以查看链接 翻译过来就是 当 toString 方法被调用的时候&#xf…

cordova报错“No installed build tools found. Install the Android build tools version - ”

在cordova 里面添加一个安卓平台后&#xff0c;用android studio打开安装gradle后&#xff0c;然后开始构建项目&#xff0c;这个时候在控制台上会报错 这个时候看到对应的文件下报错信息。 然后我们打开这个文件后&#xff0c; 发现这个 if else 判断走了 else 里面的代码&a…

Vim 常用命令总结

vi 命令编辑器有三种模式&#xff1a;命令模式&#xff0c;编辑模式和末行模式。 命令模式&#xff1a;键盘的任意一个键都可以当成“编辑命令”。 编辑模式&#xff1a;键盘的任意一个键都当成“文本内容”。 末行模式&#xff1a;键盘的任意一个键都当成“文本管理命令”。…

Python数据结构与算法(四)--顺序表

顺序表 在程序中&#xff0c;经常需要将一组&#xff08;通常是同为某个类型的&#xff09;数据元素作为整体管理和使用&#xff0c;需要创建这种元素组&#xff0c;用变量记录它们&#xff0c;传进传出函数等。一组数据中包含的元素个数可能发生变化&#xff08;可以增加或删…

Python数据结构与算法(五)--链表

链表 链表的定义: 链表&#xff08;Linked list&#xff09;是一种常见的基础数据结构&#xff0c;是一种线性表&#xff0c;但是不像顺序表一样连续存储数据&#xff0c;而是在每一个节点&#xff08;数据存储单元&#xff09;里存放下一个节点的位置信息&#xff08;即地址…

Python数据结构与算法(六)--栈和队列

栈和队列 栈&#xff08;stack&#xff09;&#xff0c;有些地方称为堆栈&#xff0c;是一种容器&#xff0c;可存入数据元素、访问元素、删除元素&#xff0c;它的特点在于只能允许在容器的一端&#xff08;称为栈顶端指标&#xff0c;英语&#xff1a;top&#xff09;进行加…

Python排序算法(一)冒泡排序、选择排序、插入排序

今天总结一下Python中的排序算法。这篇文章有的排序算法是&#xff1a;冒泡排序、选择排序、插入排序。 冒泡排序 先看一下代码。 冒泡排序 def bubble_sort(aList):n len(aList)for i in range(0, n - 1):for j in range(0, n - i - 1):if aList[j] > aList[j 1]:aList…

Python排序算法(二) 快速排序、希尔排序、归并排序

这篇文章有的排序算法是&#xff1a;快速排序、希尔排序、归并排序。 快速排序 快速排序 def quick_sort(aList, first, last):if first > last:returnmin_val aList[first]low_index firsthight_index lastwhile low_index < hight_index:# hight 左移动while low_i…

python二分法查找

常见的搜索方法&#xff1a;顺序查找、二分法查找、二叉树查找、哈希查找。 二分法查找 二分查找又称折半查找&#xff0c;优点是比较次数少&#xff0c;查找速度快&#xff0c;平均性能好&#xff1b;其缺点是要求待查表为有序表&#xff0c;且插入删除困难。因此&#xff0…

【Python学习笔记】Python深拷贝和浅拷贝

Python中copy模块里面常用的两个方法copy.copy() 和copy.deepcopy()也就是浅拷贝和深拷贝 1、copy.deepcopy() 深拷贝&#xff0c;是对于一个对象所有层次的拷贝。 2、copy.copy()浅拷贝&#xff0c;一般来说是对最顶层对象的拷贝。另外浅拷贝对不可变类型&#xff08;如&…

Python装饰器(一)

要学习装饰器&#xff0c;首先要知道闭包的东西。不过这里不再说闭包的东西了。 我们假设一个场景&#xff1a;假如在公司有多个开发部门&#xff0c;A、B....。现在A部门开发出了一个功能&#xff0c;然后其他部门去调用A部门开发的功能。 比如: 如下f1、f2...&#xff0c;是…

Python装饰器(二)

想再说一下装饰器的使用和原理。 之前已经说了装饰器的概念&#xff0c;和语法&#xff0c;这里想再进一步说一下几个装饰器的例子。 例子一&#xff1a; def makBlod(fn):def wrappen():return "<b>" fn() "</b>"return wrappendef makI…