资讯专栏INFORMATION COLUMN

本地存储cookie的封装,提供简单的API

wwq0327 / 1968人阅读

摘要:本地存储的封装,提供简单的,没有对做兼容处理,因为俺主要用于,,移动端等先进浏览器里面跑。安装下载地址设置的值,生存时间半个小时获取的值,显示删除清空获取所有批量设置的值过期时间路径域以及安全。如果想让本地也加密,得自己加密数据。




本地存储cookie的封装,提供简单的AIP,没有对IE做兼容处理,因为俺主要用于chrome,Safari,Firefox、移动端等先进浏览器里面跑。如果您有需求,可以自行解决,共享出来。目前俺用不上,所以不想兼容IE。。。

安装 bower
$ bower install icookie
$ bower info icookie # Run bower info icookie to list the available versions.
npm
$ npm install cookiejs

Github下载地址

cookie APIs
cookie("test","tank",1800)  //设置 cookie 的值,生存时间半个小时
cookie("test")              //获取 cookie 的值,显示tank
cookie("test",null)         //删除cookie test
cookie()                    //清空cookie

cookie.set("test","tank",1800)  //====cookie("test","tank",1800)
cookie.get("test")              //====cookie("test")
cookie.remove("test")           //====cookie("test",null)
cookie.clear()                  //====cookie()

cookie.all()                    //获取所有 cookie
批量设置cookie的值
cookie.set({
   name1: "value1",
   name2: "value2"
});
expires过期时间、 path路径、 domain域、以及 secure安全。
cookie("test","123",{
    "expires": 7,
    "path": "/",
    "domain":""
});
cookie({"test":"123"},{
    "expires": 7,
    "path": "/",
    "domain":""
});

key value default value
expires 过期时间(天)。指定cookie的生命期。具体是值是过期日期。如果想让cookie的存在期限超过当前浏览器会话时间,就必须使用这个属性。当过了到期日期时,浏览器就可以删除cookie文件,没有任何影响。 浏览器关闭过期
domain 域。指定关联的WEB服务器或域。值是域名,比如pc175.com。这是对path路径属性的一个延伸。如果我们想让 catalog.pc175.com 能够访问shoppingcart.pc175.com设置的cookies,该怎么办? 我们可以把domain属性设置成“pc175.com”,并把path属性设置成“/”。tag:不能把cookies域属性设置成与设置它的服务器的所在域不同的值。 默认本域
path 路径。指定与cookie关联的WEB页。值可以是一个目录,或者是一个路径。如果http://www.pc175.com/devhead/index.html 建立了一个cookie,那么在http://www.pc175.com/devhead/目录里的所有页面,以及该目录下面任何子目录里的页面都可以访问这个cookie。这就是说,在http://www.pc175.com/devhead/stories/articles 里的任何页面都可以访问http://www.pc175.com/devhead/index.html建立的cookie。但是,如果http://www.pc175.com/zdnn/ 需要访问http://www.pc175.com/devhead/index.html设置的cookes,该怎么办?这时,我们要把cookies 的path属性设置成“/”。在指定路径的时候,凡是来自同一服务器,URL里有相同路径的所有WEB页面都可以共享cookies。现在看另一个例子:如果想让 http://www.pc175.com/devhead/filters/ 和http://www.pc175.com/devhead/stories/共享cookies,就要把path设成“/devhead”。 默认 /
secure 安全。指定cookie的值通过网络如何在用户和WEB服务器之间传递。这个属性的值或者是“secure”,或者为空。缺省情况下,该属性为空,也就是使用不安全的HTTP连接传递数据。如果一个 cookie 标记为secure,那么,它与WEB服务器之间就通过HTTPS或者其它安全协议传递数据。不过,设置了secure属性不代表其他人不能看到你机器本地保存的cookie。换句话说,把cookie设置为secure,只保证cookie与WEB服务器之间的数据传输过程加密,而保存在本地的cookie文件并不加密。如果想让本地cookie也加密,得自己加密数据。 false
set

设置 cookie 的值,设置时间

cookie.set(name,value,options)
效果相同cookie(name,value,options)

cookie("test","tank",30)    //设置cookie,并设置过期时间30天

cookie("test","123",{       //设置cookie,并设置过期时间7天,路径、域
    "expires": 7,
    "path": "/",
    "domain":""
});

cookie({"test":"123","test2":"456"},{  //批量设置
    "expires": 7,
    "path": "/",
    "domain":""
});
get

获取 cookie 的值

cookie.get(name)
效果相同cookie(name)

store.get("wcj1") //获取wcj1的字符串数据
store("wcj1") //功能同上
clear

清空cookie

cookie.clear()
效果相同cookie()

cookie()
cookie.clear(
remove

删除cookie

cookie.remove(name)
效果相同cookie(name,null)

cookie.remove("test") //删除cookie test
cookie("test",null) //这样也是 删除cookie test

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/87675.html

相关文章

  • 一文带你看懂cookie,面试前端不用愁

    摘要:的属性在浏览器的控制台中,可以直接输入来查看。可以在浏览器的控制台中看出哪些是类型的,下带绿色对勾的即是,如图只要是类型的在控制台通过是获取不到的,也不能进行修改。当会话过期或被放弃后,服务器将终止该会话。在中,用取代了。 本文由云+社区发表 在前端面试中,有一个必问的问题:请你谈谈cookie和localStorage有什么区别啊? localStorage是H5中的一种浏览器本地存...

    notebin 评论0 收藏0
  • Web存储之LocalStorage初探

    摘要:存储之初探的发布和定稿为前端界带来巨大的变化,新增的和特性给业务带来了更多可能性,让用户体验拥有了更可能的丰富。只读返回一个整数,表示存储在对象中的数据项数量。会在过期时间之后销毁。安全性方面,中一般不建议存储敏感信息。 Web存储之LocalStorage初探 HTML5的发布和定稿为前端界带来巨大的变化,新增的API和特性给业务带来了更多可能性,让用户体验拥有了更可能的丰富。 · ...

    wpw 评论0 收藏0
  • 详解Cookie,localStorage与seesionStorage

    摘要:缺点数量和长度受限制,数量部分不同的浏览器不一样,长度是不能超过,否则会被截掉。更容易受到安全攻击。不会在每个请求中被携带。遵循同源政策,保存数据会相对来说安全些。的优缺点基本上和是相同的,同属于,返回的也都是一个对象。 前言 这些api的发展历程? 这些api各自的优缺点是什么? 这些api的使用场景? 怎么用就不说了,因为直接看文档就可以了 参考了很多篇文章,现在把所看的内容总...

    Rango 评论0 收藏0

发表评论

0条评论

wwq0327

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<