Chrome浏览器版本升级带来的跨域访问问题

简介: 本文主要讲Chrome浏览器版本升级带来的跨域访问问题



1、背景


最近在公司研发群,发现有人反馈内部网站跨域访问莫明的出现站点重定向问题,并且都是谷歌80 版本之后出现。


准确的说是78版本之后,并且可能存在同一版本不同人的浏览器表现不同,作者本人也升级了谷歌版本为最新,没有发现这个问题。换句话说这TM就是一桩冤案。作为一个苦逼的研发,冤案不是第一次 见,还是要解决的。


2、探索


重定向的原因无非就是没有cookie,导致没有登录态。沿着这个思路我们展开了一系列的探索。


2.1 探索1,谷歌设置,允许第三方Cookie


结果:失败,没有解决问题


2.2 探索2,浏览器改变SameSite设置


  • 谷歌浏览器地址栏输入:chrome://flags/
  • 找到:SameSite by default cookies、Cookies without SameSite must be secure
  • 设置上面这两项设置成 Disable

结果:成功解决,但是,这个方案有点局限,如果所有人都遇到这个问题,你还需要给每一个人都去说一遍,你需要打开chrome://flags/ ,设置SameSite,天,太麻烦了。出口堵住太麻烦了,当然这也是一种临时方案,所以我们还是要像一个简单点的方案,就是从来源去解决。


2.3 探索3,set-cookie改变SameSite设置


网站跨域访问莫明的出现站点重定向,源头在哪,就是在统一登录的地方,如果我们在统一登录的地方设置了SameSite,哪是不是就在所有用到当前登录态的地方就解决了这个问题。怎么操作了。 操作很简单,其实就是在报文里面set-cookie,添加SameSite=None; Secure

结果:完美解决,一劳永逸。不要给所有人解释你需要怎么怎么做了。


3、原因


最后我回过来思考一下为什么会出现这样的原因了。大家发现在探索的过程中,基本都是改变了SameSite的设置,才成功解决的。 Cookie 的SameSite属性用来限制第三方 Cookie,从而减少安全风险。它可以设置三个值:


  • Strict

Strict最为严格,完全禁止第三方 Cookie,跨站点时,任何情况下都不会发送 Cookie。换言之,只有当前网页的 URL 与请求目标一致,才会带上 Cookie。

Set-Cookie: CookieName=CookieValue; SameSite=Strict;


这个规则过于严格,可能造成非常不好的用户体验。比如,当前网页有一个 GitHub 链

接,用户点击跳转就不会带有 GitHub 的 Cookie,跳转过去总是未登陆状态。


  • Lax

Lax规则稍稍放宽,大多数情况也是不发送第三方 Cookie,但是导航到目标网址的 Get 请求除外。

Set-Cookie: CookieName=CookieValue; SameSite=Lax;


设置了Strict或Lax以后,基本就杜绝了 CSRF 攻击。当然,前提是用户浏览器支持 SameSite 属性。


  • None

网站可以选择显式关闭SameSite属性,将其设为None。不过,前提是必须同时设置Secure属性(Cookie 只能通过 HTTPS 协议发送),否则无效。


Set-Cookie: widget_session=abc123; SameSite=None; Secure


chrome升级到80版本之后(准确的说是78版本之后),cookie的SameSite属性默认值由None变为Lax,这个才是本次事件的根本原因。


这个问题在社区也是有讨论的,讨论地址:github.com/google/goog…

目录
相关文章
|
运维 Prometheus 监控
如何在测试环境中保持操作系统、浏览器版本和服务器配置的稳定性和一致性?
如何在测试环境中保持操作系统、浏览器版本和服务器配置的稳定性和一致性?
|
Web App开发 JSON 安全
Chrome浏览器的跨域问题
【10月更文挑战第6天】
2196 123
|
10月前
|
Web App开发 编解码 vr&ar
使用Web浏览器访问UE应用的最佳实践
在3D/XR应用开发中,尤其是基于UE(虚幻引擎)开发的高精度场景,传统终端因硬件局限难以流畅运行高帧率、复杂效果的三维应用。实时云渲染技术,将渲染任务转移至云端服务器,降低终端硬件要求,确保用户获得流畅体验。具备弹性扩展、优化传输协议、跨平台支持和安全性等优势,适用于多种终端和场景,特别集成像素流送技术,帮助UE开发者实现低代码上云操作,简化部署流程,保留UE引擎的强大开发能力,确保画面精美且终端轻量化。
451 17
使用Web浏览器访问UE应用的最佳实践
|
Web App开发 存储 前端开发
Chrome浏览器的跨域问题
Chrome浏览器的跨域问题
872 128
|
移动开发 JSON JavaScript
|
域名解析 网络协议 前端开发
浏览器输入域名网址访问后的过程详解
1、以91处理网为例,客户端浏览器通过DNS解析到www.91chuli.com,IP地址是202.108.22.5,通过这个IP地址找到客户端到服务器的路径。客户端浏览器发起一个HTTP会话到202.108.22.5,然后通过TCP进行封装数据包,输入到网络层。
488 2
|
Web App开发 API Windows
取接口访问者信息[IP,浏览器,操作系统]免费API接口教程
此API用于获取访问者的IP地址、浏览器和操作系统信息,支持70多种浏览器和操作系统。通过POST或GET请求至`https://cn.apihz.cn/api/ip/getapi.php`,需提供用户ID和KEY。返回结果包括状态码、消息、IP、浏览器和操作系统信息。示例:{"code":200,"ip":"175.154.88.178","browser":"Chrome","os":"Windows 10"}。详情见官网文档。
|
Web App开发 JSON 数据格式
【Azure Developer】浏览器查看本地数据文件时遇见跨域问题(CORS)
【Azure Developer】浏览器查看本地数据文件时遇见跨域问题(CORS)
119 0
【Azure Developer】浏览器查看本地数据文件时遇见跨域问题(CORS)
|
Web App开发 JSON 安全
【跨域难题终结者】:一键解锁Chrome浏览器神秘设置,彻底告别开发阶段的跨域烦恼!
【8月更文挑战第20天】跨域是前端开发常遇难题,尤其在前后端分离项目中。浏览器因安全考量会阻止不同源间的请求。本文对比CORS、JSONP、代理服务器等解法,并介绍开发阶段通过调整Chrome设置来临时禁用跨域限制的方法,提供启动Chrome及使用`fetch`API示例,适合快速测试。但请注意这不适用于生产环境,存在一定安全风险。
3055 1
Edge——如何打开IE浏览器进行访问
Edge——如何打开IE浏览器进行访问
201 4