cookie 的理解-2

122 阅读2分钟

这是我参与8月更文挑战的第30天,活动详情查看:8月更文挑战

前言

吃饱饭才有力气写代码~

昨天学了cookie的定义,限制以及组成;今天继续~

JavaScript中的cookie

在JavaScript中处理cookie的接口很简单,就是BOM的document.cookie属性;使用这个属性获取值时,它返回包含页面中所有有效cookie的字符串,并以分号分隔;如下所示

name1=TOM;name2=Marry;name3=Jack

在设置值时,可以通过document.cookie属性设置新的cookie字符串,这个字符串在经过解析之后添加到原来的cookie中,设置这个属性不会覆盖之前存在的任何cookie;设置cookie的格式如下:

document.cookie = "name=Tom";

只有cookie的名称和值是必须的;以上这句代码会创建一个名为"name"的会话cookie,它的值为"Tom";这个cookie会在每次客户端向服务器发送请求时都会被带上,在浏览器关闭时就会被删除;虽然这么设置也行,但是最好还是使用encodeURIComponent()对名称和值进行编码,如:

document.cookie = encodeURIComponent("name") + "=" + encodeURIComponent("Tom");

想要为创建的cookie指定额外的信息,只要像Set-Cookie头部一样直接在后面追加相同格式的字符串即可:

document.cookie = encodeURIComponent("name") + "=" + encodeURIComponent("Tom") + " ; domain=.wrox.com; path=/" ;

因为在JavaScript中读写cookie不是很直观,与cookie相关的基本操作如读、写、和删除就用辅助函数来简化这些操作;

//完整代码可参考相关资料
//用于取得给定名称的cookie值
CookieUtil.get()
//用于设置页面上的cookie
CookieUtil.set()
//用于删除已有cookie
CookieUtil.unset()

使用cookie 的注意事项

还有一种cookie叫做HTTP-only,它可以在浏览器设置,也可以在服务器设置,但是只能在服务器上读取,因为JavaScript无法取得这种cookie;
因为所有的cookie都会作为请求头部由浏览器发送给服务器,所以在cookie中保存大量信息可能会影响特定域浏览器请求的性能,保存的cookie越大,请求完成的时间就越长,即使浏览器对cookie大小有限制,最好还是尽可能只通过cookie保存必要信息,以避免性能问题;
注意:不要在cookie中存储重要或敏感的信息,cookie数据不是保存在安全的环境中,因此任何人都可能获得;所以出于安全考虑,应该避免把信用卡号或者个人地址之类的信息保存在cookie中。