前言:我们在查看一个项目的Cookie时,有时会看到多个域名下的Cookie,如下图:

  

  

  其中一种常见的原因是:因为我们在项目中引用了另一个项目的资源。如下图:

  

  重点:浏览器的一种默认机制:如果我们引用了另一个项目的资源,那么该项目域下的Cookie对本项目可见;但是虽然可见,但依然,不可跨域访问和设置Cookie。

  那么我们如何去模仿一下这个效果呢?

  实验方案一:根据默认机制,我们需要2个项目,A和B,在A里建一个可以创建A对应域名:a.com的Cookie的JS:test.js,在B项目里添加A项目的资源:

  1-项目A-test.js:

alert(1);
$(function () {
alert(2);
$.cookie('the12345555', 'value123', { expires: 7, domain: 'a.com', path: '/' });
});

  2-项目B-common.js添加A项目资源:

var script = document.createElement('script');
script.src = "https://mstyle1.tbdress.com/script/usercenter/test.js";
script.type = "text/javascript";
script.async = true;
document.head.appendChild(script);

  最后访问B项目测试效果:我们可能会遇到浏览器的提示:blocked devtools   或者   request may be blocked    请参考解决访问:https://community.akamai.com/customers/s/article/Blocking-Requests-Other-Hidden-Chrome-Developer-Tools?language=en_US

  也可以在谷歌浏览器打开开发者工具F12,在按F1打开设置页面如下,大家试试效果吧:

  

  测试结果:有弹框,但是cookie设置失败!  但是我们看到了a项目下的cookie,只是没有添加新的cookie成功。   这是因为新的cookie创建的方式是靠B引用A,在B里执行了域名在A下的Cookie,属于跨域设置Cookie,最后的结果必然就失败了。

  

  根据上面失败的原因改进实验:

  实验方案二:我们需要2个项目,A和B,在A里建一个可以创建A对应域名:a.com的Cookie的JS:test.js,在A项目里引用test.js(让创建方法执行在A项目中),在B项目里添加A项目的资源test.js,其实可以是任一资源,不一定在引用test.js,即使引用了,也会跨域设置失败,真正成功的还是靠A项目自己执行的效果。   思路就是这样了,大家自己测试哈。

  实验方案三:我们需要2个项目,A和B,  B随便引用A的一资源,同时B发起一个异步请求到A中,让A在程序中创建A的Cookie,由于B引用了A的资源,那么A自己创建的Cookie对B可见。      自己实现哈。

项目中出现多个域名下的Cookie的更多相关文章

  1. laravel 中 同个主域名下,多个项目共享session登录状态

    共享session的前提是session在一个公共的地方,比如database,redis等,laravel框架提供了很大驱动选择: 这里只需要在配置文件里配置三个地方即可 'driver' => ...

  2. Vue 项目中遇到的跨域问题及解决方法

    原文:https://www.jb51.net/article/137278.htm 问题描述 前端 vue 框架,跨域问题后台加这段代码 header("Access-Control-Al ...

  3. 相同域名下的cookie污染

    问题描述 本地用同一个tomcat调试两个相同框架的不同项目,在同一个浏览器界面里切换时,A项目的登录会把B项目的登录给踢掉,翻反过来亦如此.通过查看浏览器cookie,发现两个项目的cookie完全 ...

  4. 以整体思维看问题:解决单页应用,系统角色请求覆盖身份唯一标识(本项目中是session_id命名的)发送请求问题

    以前都是开始一段废话的,现在直接进入主题,首先介绍一下一些概念: 单页应用: 优点: 具有桌面应用的即时性.网站的可移植性和可访问性. 用户体验好.快,内容的改变不需要重新加载整个页面,web应用更具 ...

  5. Vue+webpack项目中实现跨域的http请求

    目前Vue项目中对json数据的请求一般使用两个插件vue-resource和axios, 但vue-resource已经不再维护, 而axios是官方推荐的且npm下载量已经170多万,github ...

  6. Atitit.css 规范 bem  项目中 CSS 的组织和管理

    Atitit.css 规范 bem  项目中 CSS 的组织和管理 1. 什么是BEM?1 1.1. 块(Block)2 1.2. 元素(Element)2 1.3. BEM树(和DOM树类似).3 ...

  7. 如何在ASP.NET Core中实现CORS跨域

    注:下载本文的完整代码示例请访问 > How to enable CORS(Cross-origin resource sharing) in ASP.NET Core 如何在ASP.NET C ...

  8. Flash+fms视频录制在项目中的实际应用

    Flash+fms视频录制在项目中的实际应用 前言:以下只是记录本人在项目中的应用,而flash+fms视频录制有多种实现方式,具体可根据实际情况而定! 1:古人云:工欲善其事,必先利其器,首先安装f ...

  9. 项目中关于ajax jsonp的使用

    项目中关于ajax jsonp的使用,出现了问题:可以成功获得请求结果,但没有执行success方法总算搞定了,记录一下 function TestAjax() {    $.ajax({       ...

随机推荐

  1. 经验之谈-switch结构常见错误的分析与处理

    1.缺少break语句 本来只想输出“出任武林盟主”可输出结果为 错误分析:在 switch结构中,每一个case语句块后面如果不写 break语句, switch就会 直接往下面的case语句块运行 ...

  2. windows下cocos2d-x环境搭建

    该教程使用的cocos2dx的版本为3.14,3之后的大概都差不多 Python环境搭建: cocos2dx在windows上新建工程需要用到python脚本,安装python-2.7.x,可以上py ...

  3. ASP.NET Core 2.2 WebApi 系列【九】使用SignalR

    1.添加 SignalR 客户端库 右键点击项目->然后选择“添加” >“客户端库” 提供程序选择:unpkg ,库选择:@aspnet/signalr@1.1.4 选择“选择特定文件” ...

  4. [Abp vNext 源码分析] - 5. DDD 的领域层支持(仓储、实体、值对象)

    一.简要介绍 ABP vNext 框架本身就是围绕着 DDD 理念进行设计的,所以在 DDD 里面我们能够见到的实体.仓储.值对象.领域服务,ABP vNext 框架都为我们进行了实现,这些基础设施都 ...

  5. 并发容器之ConcurrentLinkedQueue

    本人免费整理了Java高级资料,涵盖了Java.Redis.MongoDB.MySQL.Zookeeper.Spring Cloud.Dubbo高并发分布式等教程,一共30G,需要自己领取.传送门:h ...

  6. javaWeb技术第二篇之CSS、事件和案例

    <!--内联式 CSS (层叠样式表) 编辑 层叠样式表(英文全称:Cascading Style Sheets) CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式 ...

  7. python中字典

    字典中key:不可改变的数据类型 #fromkeys 快速定义一个空字典 res = {}.fromkeys([']) print(res) 定义字典: dict1 = { 'name1':'天明', ...

  8. 使用VSCode创建一个Vue项目

    vue-cli 是vue.js的脚手架,用于自动生成vue.js模板工程的. 安装vue-cli之前,需要先安装了vue和webpack · node -v          //(版本低引起:bas ...

  9. JVM GC算法 垃圾回收器

    JVM的垃圾回收算法有三种: 1.标记-清除(mark-sweep):啥都不说,直接上图 2.标记-整理(mark-compact) 3.复制(copy) 分代收集算法                 ...

  10. 子传父flase注意点

    1==>在子传递数据给父亲的时候, closeBottom(){ this.$emit("closeBottom",false) } false不加引号. 2==>