使用js实现对cookie的增删改查

更新日期: 2019-09-18阅读: 2.6k标签: cookie

简单的操作cookie

存储cookie(key为test;value为testValue): 

document.cookie = "test=testValue";

存储多个cookie:

document.cookie = "test1=testValue1";
document.cookie = "test2=testValue2";

获取cookie:

var getCookie = document.cookie;

 

设置cookie:

//设置cookie
function setCookie(cookieName, cookieValue) {
    var expires = "1"; //过期时间,此处设置有效期为1天
    var exp = new Date();
    exp.setTime(exp.getTime() + expires * 24 * 60 * 60 * 1000); //设置失效时间(不设置的话,浏览器关闭后此cookie将丢失)
    document.cookie = cookieName + "=" + escape(cookieValue) + ";expires=" + exp.toGMTString() + ";path=" + "/";
}

注:由于在cookie的名或值中不能使用分号(;)、逗号(,)、等号(=)以及空格。

而在cookie的名中我们可以控制,但要保存的值是不确定的,怎么办呢?

这时就需要用escape()函数进行编码,它能将一些特殊符号使用十六进制表示,例如空格将会编码为“20%”,从而可以存储于cookie值中,而且使用此种方案还可以避免中文乱码的出现,取的时候用unescape()函数解码即可。

修改cookie:需要修改cookie时,只需要重新复制即可。


获取cookie:

//读取cookie
function getCookie(cookieName){ 
	var arr,reg=new RegExp("(^| )"+cookieName+"=([^;]*)(;|$)");
	if(arr=document.cookie.match(reg))
		return unescape(arr[2]); 
	else 
		return null; 
}

注:当存入多个cookie时,使用document.cookie读取时会全部取出来,可能我们只是想获取其中一个(如:test1),这样的结果不是我们想要的,因此用到了new RegExp()来帮我们过滤,同时使用match()函数来获取到最终的值,由于存的是编码后的值,所以需要通过unescape()来进行解码即可得到我们想要的结果。


删除cookie:

其实删除cookie说白了就是设置cookie的过期时间为过去的一个时间,即让cookie过期。

//删除cookie
function delCookie(cookieName ){ 
	var exp = new Date(); 
	exp.setTime(exp.getTime() - 1); 
	var cval=getCookie(cookieName ); 
	if(cval!=null) 
		document.cookie= cookieName  + "="+cval+";expires="+exp.toGMTString()+";path="+"/"; 
}


设置可访问cookie的路径:

cookie_dir表示可以访问cookie的目录,使用path属性可设置其值(设置仅在test目录下可用):

document.cookie="cookieName=cookieValue; path=/test";

注:path="/"表示cookie在整个网站下都可用


设置cookie域:

domain表示cookie所在域,默认为请求的地址,并且默认情况下一个主机中创建的cookie在另一个主机下是不能被访问的。

如:网址test1.test.com要访问test2.test.com下的cookie可设置domain参数来实现

document.cookie="cookieName=cookieValue;domain=.test.com";


链接: https://fly63.com/article/detial/5361

angular + nodejs + CORS 实现跨域不丢失cookie做法

angular的4200端口 向 nodejs的8080端口 发送一个post请求, 这会造成跨域问题,跨域,指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的,是浏览器对javascript施加的安全限制

js实现cookie有效期至当次日凌晨

实际开发中有要求用户一些行为每天一次,次日开始重新回复功能,一般前端都是通过cookie来记住用户的操作,然后进行判断当日是否还有机会,这时候需要给存储的cookie值一个有效期,让次日自动失效,重新计数,代码如下:

你真的了解 Cookie 和 Session 吗?

我在做面试官的时候,曾经问过很多朋友这个问题: Cookie 和 Session 有什么区别呢?大部分的面试者应该都可以说上一两句,比如:什么是 Cookie?什么是 Session?两者的区别等。

关于cookie domain中的点前缀

浏览器已经接收指令,之前在一级域名下存储了相关的信息。这里为了简化问题,假设我们有两个应用A和B,域名分别为:a.b.com和c.a.b.com。(显然B是A的一个子域)。

jquery之cookie操作_jquery.cookie.js

定义:让网站服务器把少量数据储存到客户端的硬盘或内存,从客户端的硬盘读取数据的一种技术;下载与引入:jquery.cookie.js基于jquery;先引入jquery,再引入:jquery.cookie.js

JS中设置cookie,读取cookie,删除cookie

Cookie 是在您的计算机上存储在小的文本文件中的数据。当 web 服务器向浏览器发送网页后,连接被关闭,服务器会忘记用户的一切。Cookie 是为了解决“如何记住用户信息”而发明的:若要想修改某个cookie,只需要用此种方法

使用vue-cookies处理cookie

创建:this.$配置时候设置的名称.set(\\\'cookies的key\\\',value),获取指定的key:this.$配置时候设置的名称.get(\\\'cookies的key`),获取所有keys返回为数组的形式:this.$配置时候设置的名称.keys (\\\'cookies的key`)

Js操作Cookie

Web 服务器和 HTTP 服务器是无状态的,因此当 Web 服务器将网页发送到浏览器时,连接会被断开,服务器会忘记与用户相关的所有内容。那么浏览器和 Web 服务器是怎样记住用户信息的?cookie 被发明出来解决这个问题。

Js cookie工具函数封装

CookieUtil.get() 方法根据 cookie 的名字获取相应的值。它会在 document.cookie 字符串中查找 cookie 名加上等于号的位置。如果找到了,那么使用 indexOf() 查找该位置之后的第一个分号(表示了该 cookie 的结束位置)。如果没有找到分号

使用vue-cookies操作cookie

在vue中如果想要操作cookie,除了使用之前我们自己封装好的操作cookie的方法之外,我们还可以使用vue-cookies插件,这是一个简单的Vue.js插件,专门用于在vue中处理浏览器的cookie操作

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!