1、前言

使用javascript操作cookie我们都经常使用,对cookie不是很了解的话可以看下这篇帖子[javascript操作cookie](http://www.cnblogs.com/Darren_code/archive/2011/11/24/Cookie.html "javascript操作cookie");常用的cookie知识点上面那位大神已经讲完了,有点点小补充顺便说下,不对的地方欢迎吐槽。

2、外部js

  做网站经常要引入其他网站的js。一直以来我以为引入的js只能操作js链接所在域名下的cookie。比如在太平洋时尚网的pclady.com.cn的html页面中引入一个太平洋电脑网pconline.com.cn的js。我以为引入的js只能操作domian为www.pconline.com.cn的cookie;事实却不是这样子。引入的外部js其实等就同于本页面的js。所以pclady.com.cn中引入pconline.com.cn的js操作的是pclady.com.cn中cookie;

3、结论

我先说结论,不懂的可以查看测试连接;
先说一个概念,域名wwww1.pclady.com.cn 顶级域名.com.cn 一级域名pclady.com.cn;二级域名 www1.pclady.com.cn

3.1 默认domain和路径

设置cookie时 cookie默认的domain为html文件所在的域名,path为html文件所在的路径比如http://www1.pclady.com.cn/zt/20160623/testCookie.html 链接中的js设置cookie,默认情况下cookie情况如图:

3.2 domain规则,

  • 设置cookie——设置cookie的时候,domain要符合域名的规则,比如可以设置成www1.pclady.com.cn和pclady.com.cn 但是不能设置成pclady。要有.com.cn或者其他域名做结尾。 通过js手动设置cookie的domain都是以.开头的。比如设置domain=pclady.com.cn,实际的domain名为.pclady.com.cn;删除cookie时加不加.都可以。
  • 获取cookie——js只能获取domian大于等于当前页面域名的cookie。比如http://www1.pclady.com.cn/zt/20160623/testCookie.html页面中的js能获取domain为“www1.pclady.com.cn”和“.www1.pclady.com.cn”和“.pclady.com.cn”但是获取不到“g.pclady.com.cn”中的cookie;
  • 删除cookie——要删除一个cookie,domain值必须跟要删除cookie的domain相同,默认的domain为html文件的domain。
  • 跨域domain——js不可以把cookie设置成不同与html域名的domian。cookie设置不会成功,但不会影响后面程序对cookie的操作。
  • 错误——如果domain设置错误,该cookie将不会被创建,并且后续对cookie的操作不论正确与否都会被浏览器禁止。

3.3 path规则

  • 设置cookie——js设置path要以"/"开头,比如html路径为"/zt/20160623/",路径可以设置成"/"或"/zt"。
  • 获取cookie——使用js只能获取path大于等于当前页面path的cookie,比如html路径为/zt/20160623/,使用js只能获取“/zt/20160623/”和“/zt”和“/”路径下的cookie。不能获取其他路径下的cookie
  • 删除cookie——删除cookie的时候路径也必须相同,默认的路径是html的path路径。
  • 错误——如果path不是以"/"开头的则创建cookie的path使用默认的path;如果是以"/"开头但是设置错了,路径名不存在或者直接设置成子路径。比如设置成"/20160623"或者"/zt1",该cookie将不会被创建,并且后续对cookie的操作不论正确与否都会被浏览器禁止。

4、总结

4.1、页面能访问那些cookie跟从哪里引入js没有半毛钱关系。而跟html页面本身的domain和path有很直接的关系

4.2、要删除一个cookie,domain和路径必须完全相同。

5、测试过程(可忽略)

5.1、测试程序:

5.2.1、pclady下的cookie设置情况

注意:chrome的Resources面板下能查看哪些cookie就可以通过js获取哪些cookie。查看不到的当然也不能通过js获取。这也证明了,js操作cookie只跟页面有关,跟js来自哪里没有关系。
html链接:http://www1.pclady.com.cn/zt/20160623/testCookie.html
设置cookie的js链接:http://www1.pconline.com.cn/zt/20160622/GCookie-bf.js

5.3、pcbaby下的cookie情况

html链接:http://www1.pclady.com.cn/zt/20160623/testCookie.html
设置cookie的js链接:http://www1.pconline.com.cn/zt/20160622/GCookie-bf.js
检查cookie链接:http://www1.pcbaby.com.cn/zt/20160623/testCookie2.html

chrome的Resources面板中cookie是空的。所以cookie没有设置成功。

js与cookie的domain和path之间的关系的更多相关文章

  1. JS 之原型,实例,构造函数之间的关系

    JS是面向对象的语言,函数也是对象.下面大致介绍下实例,原型与构造函数之间的关系. 构造函数模式 function Person(name,age){ this.name = name; this.a ...

  2. js中prototype,__proto__,constructor之间的关系

    首先,我们需要了解三点: 1. 只要创建一个任意新函数,就会根据一个prototype属性,该属性指向函数的原型对象: 2. 每一个原型对象都会自动获得一个constructor属性,该属性只想pro ...

  3. 分享js中 pageY = clientY + document.body.scrollTop 之间的关系

    //这里没有考虑兼容ie模式下 兼容一般主流浏览器 var $1 = document.getElementById('main') $1.onclick = function(e){ console ...

  4. vue项目过程的理解: main.js文件理解 router.js文件理解 以及组件 路由 等之间的关系

    https://blog.csdn.net/qq_26229005/article/details/85040393 内容太多了,有空再整理

  5. cookie中的domain和path

    div.example { background-color: rgba(229, 236, 243, 1); color: rgba(0, 0, 0, 1); padding: 0.5em; mar ...

  6. JS设置Cookie,及COOKIE的限制

    在Javascript脚本里,一个cookie 实际就是一个字符串属性.当你读取cookie的值时,就得到一个字符串,里面当前WEB页使用的所有cookies的名称和值.每个cookie除了 name ...

  7. js设置cookie(原生js)

    cookie 与 session 是网页开发中常用的信息存储方式.Cookie是在客户端开辟的一块可存储用户信息的地方:Session是在服务器内存中开辟的一块存储用户信息的地方. JavaScrip ...

  8. 易懂 易上手的cookie 最简单明了 js中cookie的使用方法及教程

    今天项目中需要用到cookie 看到我的cookie不行了 大喊一声我曹 怎么可以这样 我就疯狂的在网上找 找啊 找 但是我感觉都太官方了   废话不说 看栗子 1.引入jQuery与jQuery.C ...

  9. 通过js对cookie的使用手册

    一般大多数人还是用引用JQuary API——jquery.cookie.js,来操作cookie.这是一种很不错的方式,我也支持这样的做法. 但是有时候我们只需要一种极为轻量级的代码来实现简单的功能 ...

随机推荐

  1. Squid服务日志分析

    Squid服务日志分析 Apache 和 Squid 是两种著名的代理缓存软件,但Squid 较 Apache 而言是专门的代理缓存服务器软件,其代理缓存的功能强大,支持 HTTP/1.1 协议,其缓 ...

  2. C++学习基础九——继承

    1.不同于Java中通过extends实现继承,C++是通过:实现的. 2.C++中同样包含public,private,protected三个关键字: public关键字表示在任意其他类中可调用该成 ...

  3. git使用命令, 特别:git checkout -b a 与 git branch a区别

    摘自: https://my.oschina.net/u/587974/blog/74341 创建分支: $ git branch mybranch 切换分支: $ git checkout mybr ...

  4. 解决ubuntu中apache2的url大小写敏感问题。

    cd /etc/apache2/mods-enabled ln -s ../mods-available/speling.load speling.load ln -s ../mods-availab ...

  5. android开发时gen和bin目录的SVN管理(转)

    转自:http://www.cnblogs.com/brucenan/archive/2012/02/23/2364702.html android在eclipse下的项目,会生成gen和bin两个目 ...

  6. mybatis like的用法

    oracle数据库: SELECT * FROM user WHERE name like CONCAT('%',#{name},'%') 或 SELECT * FROM user WHERE nam ...

  7. Elasticsearch 插件安装

    http://www.cnblogs.com/richaaaard/p/5212044.html

  8. python第十一天-----补:线程池

    低版本: #!/usr/bin/env python import threading import time import queue class TreadPool: ""&q ...

  9. CSS3样式问题

    empty-cells 属性设置是否显示表格中的空单元格 tr:nth-child(even)偶数行的表格 li:nth-child(20)指定位置 2016-09-2813:23:45

  10. ELK日志管理

    ELK一般由三部分组成:logstash(日志格式化) + elasticsearch(检索) + Kibana(前台报表展示) 官网地址:https://www.elastic.co/ 本人在这用的 ...