cookie概览

cookie是Web浏览器存储的少量命名数据,它与某个特定的网页或网站关联在一起。cookie是用来给Web浏览器提供内存,以便脚本和服务端程序可以在一个页面使用另一个页面的输入数据,或者在用户离开页面并返回时恢复用户的优先级及其他变量。

cookie操作及属性

Document对象含有一个cookie属性,通过javascript可以对cookie进行操作。

cookie是一个字符串属性,可以用它对当期网页的cookie进行读操作、创建操作、修改操作和删除操作。

除了名字和值外,每个cookie都有四个可选的属性,分别是:

expires、path、domain、secure

expires:

指定了cookie的生存期。默认情况下,cookie是暂时存在的,它们存储的值只在浏览器会话期间存在。当用户退出浏览器后,这些值也就丢失了。如果想让一个cookie存在的事件超过一个浏览器会话期,必须告诉浏览器希望它保存cookie多长时间。做到这一点就是把expires属性设置为未来的一个过期日期。尽管expires属性仍然有效,但是它已经被max-age属性所取代,后者用秒来设置cookie的生命期。设置这两个属性的任何一个,都会使浏览器把cookie保存到一个本地文件中,以便用户下次访问这个网页时能够再将它读取出来。一旦超过了终止日期,那个cookie就会被浏览器自动从cookie文件中删掉。

path:

它指定了与cookie关联在一起的网页。默认情况下,cookie会和它创建的网页以及与这个网页处于同一个目录下的网页和处于该目录下的子目录的网页关联,也就是说cookie只能在同一个目录下的网页共享。但是,有时候在不同的目录下使用到这个cookie的值,这个时候就要指定cookie的path属性了。例如:

在www.example.com/catalog/widgets/index.html 页面下设置的cookie将path属性设置为path="/catalog"

那么在www.example.com/catalog/other.html 的页面下也可以访问这个cookie的。

如果将path设置为path="/" ,那么这个cookie在www.example.com服务器上的所有网页都是可见的。

domain:

但是,在一些大的网站可能需要多个Web服务器共享cookie。例如

order.example.com 的服务器要读取位于catalog.example.com的页面创建的cookie。这就要用到cookie的domain属性了。将domain属性设置成domain=".example.com",那么位置example.com域的其它服务器上的网页都可以访问这个cookie。如果没有设置domain属性,默认值就是创建cookie的网页所在服务器主机名。

secure:

它指定了网络上如恶化传输cookie值。默认情况下cookie是不安全的,也就是说,他们是同个一个普通的、不安全的HTTP链接传输的。但是如果将cookie标记为安全,那么它将在浏览器和服务器通过HTTPS或其他安全协议连接时才被传输。

cookie操作DEMO:

创建一个缓存一年的cookie:

document.cookie = "user = value;max-age="+(60*60*24*356);

设置对应的属性:

document.cookie = "user = value;max-age="+(60*60*24*356)+";path="+path+";domain="+domain+";secure";

cookie工具类

 var cookies = {
//读取cookie:字符串截取方法
getCookieByStr:function (c_name){
if (document.cookie.length>0){
c_start=document.cookie.indexOf(c_name + "=");//检测是否存在对于的键值
if(c_start!=-1){
c_start=c_start + c_name.length+1; //返回等号后面一个字符索引,及对应字符开始位置
c_end=document.cookie.indexOf(";",c_start);//从c_start位置开始搜索字符";",返回字符的位置索引
if (c_end==-1) {c_end=document.cookie.length;}//如果找不到字符";",即只有一个cookie值
return unescape(document.cookie.substring(c_start,c_end)); //通过前后位置截取对于的cookie值,并解码
}
}
return ""; //不存在则返回空
},
//设置cookie--名称/值/过期天数
setCookie:function(c_name,value,expiredays){
var exdate=new Date();
exdate.setDate(exdate.getDate()+expiredays);//设置日期
document.cookie=c_name+ "=" +escape(value)+((expiredays==null) ? "" : ";expires="+exdate.toGMTString());
},
//删除cookie
delCookie:function(c_name){
var exdate = new Date();
exdate.setDate(exdate.getDate()-1);//昨天日期
document.cookie = c_name+"=;expires="+exdate.toGMTString();
}
};

完整demo下载:

【JavaScript】cookies详解.zip

cookie 详解的更多相关文章

  1. cookie详解

    一.cookie详解 (1)设置cookie 每个cookie都是一个名/值对,可以把下面这样一个字符串赋值给document.cookie: document.cookie="userId ...

  2. ASP.NET 操作Cookie详解 增加,修改,删除

    ASP.NET 操作Cookie详解 增加,修改,删除 Cookie,有时也用其复数形式Cookies,指某些网站为了辨别用户身份而储存在用户本地终端上的数据(通常经过加密).定义于RFC2109.它 ...

  3. 网络基础 cookie详解

    cookie详解 by:授客 QQ:1033553122 cookie干嘛用的? 参见文章http 会话(session)详解: 网络基础 http 会话(session)详解   cookie分类 ...

  4. cookie详解(含vue-cookie)

    今天看到一篇cookie的文章,写的特别详细,感谢 晚晴幽草轩 的分享,原文链接http://mp.weixin.qq.com/s/NXrH7R8y2Dqxs9Ekm0u33w 原文如下,记录到此供以 ...

  5. Session和Cookie详解(1)

    面试常问的有关session和cookie的问题: 1.session在分布式环境下怎么解决 2.集群下如何保证session踩中 3.cookie的大小 4.服务器怎么识别一个用户的 5.sessi ...

  6. JavaWeb Cookie详解

    代码地址如下:http://www.demodashi.com/demo/12713.html Cookie的由来 首先我们需要介绍一下,在Web开发过程中为什么会引入Cookie.我们知道Http协 ...

  7. Cookie 详解以及实现一个 cookie 操作库

    Cookie 详解以及实现一个 cookie 操作库 cookie 在前端有着大量的应用,但有时我们对它还是一知半解.下面来看看它的一些具体的用法 Set-Cookie 服务器通过设置响应头来设置客户 ...

  8. [转]Cookie详解

    从事 Web 开发已有近17个月:在学以致用的工作学习里,对于不怎么使用的部分,多少有些雾里探花的窘迫感-差不多是了解一二,然而又非真切的明晰:这就使得再用的时候,总要去再搜索一番:如此颇为难受,倒不 ...

  9. Cookie的使用、Cookie详解、HTTP cookies 详解、获取cookie的方法、客户端获取Cookie、深入解析cookie

    Cookie是指某些网站为了辨别用户身份.进行session跟踪而存储在用户本地终端上的数据(通常经过加密),比如说有些网站需要登录才能访问某个页面,在登录之前,你想抓取某个页面内容是不允许的.那么我 ...

  10. Java web Cookie详解(持久化+原理详解+共享问题+设置中文+发送多个Cookie)

    Java web Cookie详解 啥是cookie? 查询有道词典得: web和饼干有啥关系? 这个谜底等等来为大家揭晓 会话技术 web中的会话技术类似于生活中两个人聊天,不过web中的会话指的是 ...

随机推荐

  1. 左侧滚动条js

    <script> var left = document.getElementById('main-left'); var right = document.getElementById( ...

  2. 026_lsof命令经验总结

    一.lsof处理删除文件未释放句柄问题. 但是如果你不知道是哪个文件,或者是很多文件都有这样的情况,那你需要使用如下命令 lsof |grep deleted 注:这个deleted表示该已经删除了的 ...

  3. ubuntu安装Qt

    一.安装 卸载旧版本Qt,找到安装目录,例如:/home/likewei/Qt5.11.2,终端输入命令进入该目录,输入命令:./MaintenanceTool      进入图形画面卸载就行了 1. ...

  4. 利用表格分页显示数据的js组件bootstrap datatable的使用

    前面展示了datatable的简单使用,还可以通过bootstrap结合datatable来使用,这样可以进一步美化datatable插件 <!DOCTYPE html> <html ...

  5. css和javascript代码写在页面中的位置说明

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. CANopen--Copley驱动器 ACJ-055-18 过程数据PDO的断电保存方法

    Copley CANopen 系列驱动器中,均保存有默认的 PDO 设置, 如下图所示 实际使用中,往往需要修改默认的 PDO 配置,以映射不同模式或功能下的 PDO 对象,但由于 PDO 配置无法存 ...

  7. websocket:日常总结

    1.报错:DefaultHandshakeHandler : Handshake failed due to invalid Upgrade header 参考文章:https://www.cnblo ...

  8. 百度echarts插件x轴坐标显示不全决解方法

    X轴显示不全: xAxis.axisLabel.interval number, Function [ default: 'auto' ] 坐标轴刻度标签的显示间隔,在类目轴中有效. 默认会采用标签不 ...

  9. [MySQL]group by 与 having 结合函数 的统计技巧

    group by 与 having 允许字段使用函数,根据函数运行的结果group by分组或having设置选择条件; 同时group by 与 having 也允许使用字段别名 示例表a: id ...

  10. Oracle PGA作用&work_mode

    专有模式下ORACLE会给每个连接分配一个服务进程(Server Process),这个服务进程将为这个连接服务.为这个服务进程分配的内存叫做PGA.PGA不需要Latch也不需要Lock,永远不会发 ...