javascript - 在最新版本的 Chrome 中通过 Google OAuth2 登录时出现跨源策略问题

Question

在我的网站上，我们创建了一个弹出窗口，该窗口被重定向到 Google 授权，并在指定登录后使用 RedirectUri 返回我的网站。在主窗口中，我们检查弹出窗口的状态以确定用户是否已经登录，以便我们关闭该弹出窗口。

通常，一旦用户登录并且弹出窗口被重定向回我的站点，我们就可以在主窗口中访问弹出窗口。但是，从最新版本的 Chrome (v. 63.0.3239.132) 开始，我们会收到以下错误:

DOMException: Blocked a frame with origin "..." from accessing a cross-origin frame.

这似乎与 this Chrome bug 有关，但是我们不是从 iframe 调用 window.open(它是从主站点调用的)。 63.0.3239.132 也应该引入针对此问题的修复。

我并不总是重现这个问题:如果用户已经登录到他们的 Google 帐户，一旦弹出窗口被重定向回我的站点，主窗口就可以访问弹出窗口。此外，在初始重定向到 Google 授权(到帐户选择器页面)后，我可以将弹出窗口导航回我的站点，此时主窗口将能够再次访问弹出窗口。

此问题也不会在早期版本的 Chrome 和其他浏览器中重现。

Answer 1

我无法解决你的问题，但我可以建议一种替代方法来处理你正在做的事情。

您是否考虑过使用浏览器的 sessionStorage 在这些页面(均由您的应用程序提供)之间进行通信，而不是直接从您的主页或从您的弹出窗口 (window.opener) 访问弹出窗口？

您的页面/窗口将共享 sessionStorage，因此一个或两个可以挂接到 window.onstorage 事件以监视另一个所做的更改。

https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onstorage

我知道这需要重新开发，因此严格来说不能解决您的问题，但我希望它仍然是一个有用的建议。