在 ITP (Safari) 时使用 iframe 和 postMessage 进行单点登录(静默登录)

发布时间:2021-02-25 06:50

简短:

我需要 Safari 中 SSO 方面的帮助,我正在使用 iFrame 和 postMessage 逻辑,它们在 Chrome 和 Firefox(PC、Mac、Android 和 iOS)中运行良好,但问题在于 Safari。我尝试了存储访问 API 并将它们放在 iFrame 的 onLoading 事件中以检查访问。但是我用来存储 JWT 的 localStorage 在 iF​​rame 中不是持久的。我使用的是 Angular 11。

场景:

我正在开发几个使用相同身份验证站点进行 sso 的应用程序,正如我在简短描述中所说的那样,它按预期工作。但是,当谈到现在 Safari 启用智能跟踪预防的浏览器时,它通过将 iFrame 视为 3rd Party Trackers 来阻止 iFrame,这是非常疯狂的,因为 iFrame 的来源(域)与服务站点中使用的子域相同。

我尝试在 iFrame 脚本的窗口 onLoad 方法中使用存储访问 API 即 hasStorageAccess() 检查访问。如果没有访问权限,我调用 requestStorageAccess()。我在这里不使用用户手势并使用来自服务站点的按钮单击,因为我使用 angular 作为前端框架,但为了请求使用 iFrame 中的按钮。(因为,该策略指定仅在用户交互后才能获得访问权限另一个让开发者头疼的问题)

我需要帮助来解决这个问题并使用 ITP 修复 SSO。任何指导都是有用的,我会不断更新。

Google 的 sso 运行良好,YouTube 和 Mail 等服务无需每次访问都需要登录。关于他们如何实现的任何想法。

回答1

原因可能是 Safari 默认启用了“防止跨站点跟踪”选项,这会干扰 SSO 登录和嵌入式 iframe 的显示(因为它会阻止某些 cookie) .

解决方案

在 Safari 配置菜单中禁用(取消选中)“防止跨站点跟踪”选项。

enter image description here

提示:为了获得更好的用户体验,您可以使用 Javascript 检测用户何时使用 Safari 并向他显示一条 HTML 消息,说明他需要禁用该选项才能继续或使用其他浏览器,如 Chrome 或 Firefox。