问题如图所示
:
红色框的域名为框架的主要域名,黄色框是页面内嵌入的两个iframe的域名。红色域名登录以后cookie信息无法写入黄色域名下面,导致黄色域名下面的接口请求失败。
原因
:
Chrome 某个版本开始,浏览器的 Cookie 新增加了一个SameSite属性,用来防止 CSRF 攻击和用户追踪。并将未声明 SameSite 值的 Cookie 默认设置为SameSite=Lax Cookie。
(关于SameSite详情可参考阮一峰文章:http://www.ruanyifeng.com/blog/2019/09/cookie-samesite.html)
google设置解决方法
:
前往 chrome://flags,通过禁用“SameSite by default cookies”和“Cookies without SameSite must be secure”功能开关,修改后点击
Relaunch
重新启动即可。如下图所示:
开发者解决办法:
1.内嵌页面最好采用同站(SameSite)策略。
2.接口请求参数直接带上token请求。
3.设置sameSite: ‘none’,( 需https协议,且不同浏览器版本有兼容性问题,需要 UA 检测)(参考:https://github.com/mqyqingfeng/Blog/issues/157)
拓展知识:
1.
Cookie 的 SameSite 属性
2.
SameSite小识(Cookie携带的场景)
3.
同站 和 同源 你理解清楚了么?
问题如图所示:红色框的域名为框架的主要域名,黄色框是页面内嵌入的两个iframe的域名。红色域名登录以后cookie信息无法写入黄色域名下面,导致黄色域名下面的接口请求失败。原因:Chrome 某个版本开始,浏览器的 Cookie 新增加了一个SameSite属性,用来防止 CSRF 攻击和用户追踪。并将未声明 SameSite 值的 Cookie 默认设置为SameSite=Lax Cookie。(关于SameSite详情开参考阮一峰文章:http://www.ruanyifeng.com/blog
文章目录谷歌浏览器跨域丢失
Cookie
问题
一、
问题
背景交代二、分析2.1、整体调用链路2.2、复现2.3、分析三、原因四、解决4.1、治标4.2、治本
谷歌浏览器跨域丢失
Cookie
问题
一、
问题
背景交代
公司内部系统A
页面
内嵌
系统B的界面。当在A系统的界面中点击B系统图标跳转时此时跨域,导致跳转后的界面空白,A系统会向B系统发送一些请求参数,而B系统没有拿到这些参数,导致重定向后的界面空白。
2.1、整体调用链路
2.2、复现
这个
问题
在
Chrome浏览器
【我本地的】100%复现,后来切换到了
最近做系统,需要通过
iframe
嵌入第三方
页面
。比如我的
页面
为A网站的
页面
,嵌入在
iframe
中的为B网站的
页面
,此时如果B域名下的
页面
要在IE中写
cookie
,是不能成功的,原因在于使用
iframe
时,IE中的一个所谓的隐私首选项(简称为P3P)的W3C标准。只有在第三方
页面
上设置一个
cookie
发送头,才能允许Internet
Explorer接受第三方
Cookie
。
解决的办法有三种:
192.168.40.26服务器上有一个项目,某个
页面
嵌入了第三方系统平台,
第三方系统平台服务器地址是:192.168.40.67
页面
嵌入成功,只能访问到登录页,登陆成功但是
页面
不进行跳转。
如果单独登录第三方平台,如下图:
嵌入第三方后
页面
,如下图:
提示正常登陆成功,却没有跳转
页面
。
页面
晃动一下,但还是停留在登陆
页面
上。
判断是因为跨域
问题
,嵌入
页面
时使用192.168.40.26IP地址访问第三方192.168.40.67登录接口时登陆成功,但是前端
页面
也在这个192.168.
新版
chrome浏览器
嵌套frame
页面
一直没法显示出来(空白
页面
),
页面
未报错
问题
分析:
Google
在2020年2月4号发布的 Chrome 80 版本默认屏蔽所有第三方
Cookie
,
即默认为所有
Cookie
加上 SameSite=Lax 属性(https://www.chromestatus.com/feature/5088147346030592),并且拒绝非Secure的
Cookie
设为 SameSite=None(https://www.chromestatus.com/fe
3. 在"Application"选项卡中,找到并展开"Storage"选项卡。
4. 在"Storage"中展开"
Cookie
s"选项卡,可以看到当前浏览器中所有的
cookie
信息。
如果你希望通过代码自动获取当前浏览器中所有
cookie
信息,可以使用JavaScript代码实现。以下是获取当前浏览器中所有
cookie
的JavaScript代码示例:
```javascript
chrome.
cookie
s.getAll({}, function (
cookie
s) {
console.log(
cookie
s);
需要注意的是,上述代码是基于
Chrome浏览器
的扩展程序开发的,如果在普通的网页中执行,会因为权限限制而
无法
获取
cookie
信息。