如何从另一个用于 SSO 的 UI 应用程序获取 React 应用程序中的密钥（访问令牌）

Question

我们有两个 Web 应用程序，比如说 http://app1.com 和 http://app2.com 托管在不同的域上。

App1-> 与 OAuth 服务器通信以获取访问令牌，我们将其存储在浏览器的本地存储中。

App2 -> 用 React 开发的简单前端应用程序。

现在我们想在现有令牌的帮助下从 app1 导航到 app2。然后它将用于从 app2 调用 API。

问题：因为我们无法从不同的域访问本地存储。所以我们必须在重定向到新应用程序后再次获取访问令牌。

目前的做法： 我们在重定向时从 app1 传递加密的用户名。然后我们使用该用户名调用 Oauth 服务器以获取访问令牌。

我相信会有更好的方法来实现这一点。任何引用指针都会有所帮助。

提前致谢。

Answer 1

您不需要从 pp1 向 app2 传递任何内容。只需在 app2 中使用标准 OpenID 连接流（React 的隐式连接流）。 App2 会将用户重定向到已使用的身份提供者 (IdP)，其中用户已经打开了会话，因此 IdP 会将浏览器重定向回 app2，并使用自己的 app2 访问令牌。