chrome浏览器跨域Cookie的SameSite问题导致访问iframe内嵌页面异常

Indicate whether to send a cookie in a cross-site request by specifying its SameSite attribute

问题还原

原先一直访问正常的系统,最近打开页面一直加载不出来。

  1. 初步分析,该系统为iframe内嵌第三方系统页面,将iframe中的链接复制出来可以单独访问,排除第三方系统的问题。
  2. 进一步尝试,将这个带有链接的iframe放在一个全新的html文件中也不能正常访问,排除当前系统的iframe加载问题。
  3. 发现问题,将刚刚新建的html文件再火狐浏览器中打开可以正常访问。

最后定位是浏览器兼容性问题,当前浏览器:Google Chrome ,版本85.0.4183.102(正式版本) (64 位)。

打开浏览器控制台发现接口请求报500错,控制台出现以下提示(Indicate whether a cookie is intended to be set in a cross-site context by specifying its SameSite attribute):
在这里插入图片描述
在这里插入图片描述

原因分析

Google 在2020年2月4号发布的 Chrome 80 版本(schedule:https://www.chromestatus.com/features/schedule)中默认屏蔽所有第三方 Cookie,即默认为所有 Cookie 加上 SameSite=Lax 属性(https://www.chromestatus.com/feature/5088147346030592),并且拒绝非Secure的Cookie设为 SameSite=None(https://www.chromestatus.com/feature/5633521622188032
SameSite的作用就是防止跨域传送cookie,从而防止 CSRF 攻击和用户追踪,此举是为了从源头屏蔽 CSRF 漏洞。
关于 SameSite 属性的介绍,可参考阮一峰的《Cookie 的 SameSite 属性》。

上述问题中,在当前系统访问第三方系统时,带了一些cookie过去,然后被这个SameSite机制拦截掉了。

可能在 Chrome 80 中受到影响的场景如下

  1. 组件数据基于第三方网站的登录态返回相关用户数据的API请求
  2. HTTP 本地部署

解决方案

  1. Chrome浏览器打开新标签页,地址栏中分别输入

chrome://flags/#same-site-by-default-cookies
chrome://flags/#cookies-without-same-site-must-be-secure

在这里插入图片描述
在这里插入图片描述

然后如上如图所示将这两个配置均设置为Disabled

  1. 不使用谷歌浏览器或者将谷歌浏览器降级到 Chrome 79 及以下版本,并关闭自动更新。

  2. 将两个系统部署在同一台服务器,通过相同IP同源策略传送cookie。

  3. 购买SSL证书,升级HTTP服务,将 API 切换为 HTTPS 协议请求,并且检查响应头中的 Set-Cookie 中是否包含了 SameSite=None 和 Secure字样。

  • 10
    点赞
  • 50
    收藏
    觉得还不错? 一键收藏
  • 16
    评论
评论 16
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值