将 Keycloak 登录并入 SPA

Question

我们目前正在评估 Keycloak 作为我们的 SSO 解决方案，虽然它适用于我们基于 servlet 的应用程序，但有一个关于我们的（基于 React 的）SPA 的问题。

我们的设计师想要什么：举个例子，假设我们有一个电子邮件客户端 spa。用户正在编写电子邮件，但随后会分心。当他返回时，SSO 会话已经超时，需要重新登录。用户现在应该看到一个登录表单，登录后应该可以发送仍在 SPA 本地存储中的电子邮件（即重新登录而不重新启动 SPA 或丢失数据）。

AFAIK Keycloak 不提供身份验证 API（出于充分的理由），而是使用重定向到登录页面并返回到应用程序（据我了解，对于移动应用程序，将使用系统浏览器）。如果我没记错的话，重定向将意味着 SPA 被重新初始化，因此数据将丢失。

那么问题来了：我们的设计师想要用 Keycloak 做什么？

如果是，将如何进行？直接发布到 Keycloak 使用的登录 url 似乎是一个坏主意，因为令牌可能无法正确存储，并且可能存在同源策略问题。在 iframe 或弹出窗口中执行此操作吗？

Answer 1

对于回到这个问题的人来说，

\n

我认为最好坚持 oAuth2/OpenId Connect for SPA 的最佳实践，目前是使用 PKCE 的“授权代码流”。

\n

https://oauth.net/2/pkce/

\n

https://datatracker.ietf.org/doc/html/draft-ietf-oauth-security-topics-13

\n

这里的正常流程需要完全重定向到身份验证服务器并返回，以便您的应用程序将完全重新初始化。或者您使用 check-sso，如已经提到的静默模式中的 S\xc3\xa9bastien。

\n

https://github.com/keycloak/keycloak-documentation/blob/master/securing_apps/topics/oidc/javascript-adapter.adoc

\n

\n

您可以配置静默检查 sso 选项。启用此功能后，您的浏览器将\xe2\x80\x99不会完全重定向到 {project_name} 服务器并返回到您的应用程序，但此操作将在隐藏的 iframe 中执行，因此您只需加载应用程序资源并在应用程序初始化时由浏览器解析一次，并且在从 {project_name} 重定向回您的应用程序后不再解析。这对于 SPA（单页应用程序）特别有用。

\n

\n

这样，登录将在 iframe 中进行，并且应用程序仅初始化一次并且应该保留状态。

\n