将 Keycloak 登录合并到 SPA
Incorporate Keycloak login into SPA
我们目前正在评估 Keycloak 作为我们的 SSO 解决方案，虽然它适用于我们基于 servlet 的应用程序，但我们的（基于 React 的）SPA 存在一个问题。
我们的设计师想要什么：举个例子，假设我们有一个电子邮件客户端 spa。用户正在写一封电子邮件，但随后分心了。当他 returns 时，SSO 会话已经超时，需要重新登录。现在应该向用户显示一个登录表单，登录后应该可以发送仍在 SPA 本地存储中的电子邮件（即重新登录而不重启 SPA 或丢失数据）。
AFAIK Keycloak 不提供身份验证-api（出于充分的理由）并使用重定向到登录页面并返回到应用程序（据我所知，对于移动应用程序，系统浏览器将是用过的）。如果我没记错的话，重定向将意味着 SPA 然后重新初始化，因此数据将丢失。
那么问题来了：我们的设计师希望使用 Keycloak 可以做什么？
如果是，会怎么做？直接发布到 Keycloak 使用的 login-url 似乎是个坏主意，因为令牌可能无法正确存储并且可能存在同源策略问题。在 iframe 或 popup-window 中执行此操作是否可行？
即使这不是最佳做法，您也可以为您的客户端启用直接授予访问权限，这样可以通过 REST 调用登录。
无论如何，关于不丢失应用程序的状态，这有点超出了 Keycloak 的范围，但是您应该能够通过在重定向 URL 中包含状态来实现这一点？
此外，如果您不希望您的应用自动重定向到登录页面，您可以使用：keycloak.init({ onLoad: 'check-sso' }) 而不是 login-required
对于回到这个问题的人，
我认为最好坚持 oAuth2/OpenId Connect for SPA 的最佳实践，目前是使用 PKCE 的“授权代码流”。
https://datatracker.ietf.org/doc/html/draft-ietf-oauth-security-topics-13
此处的正常流程需要完全重定向到身份验证服务器并返回，以便您的应用程序将完全重新初始化。或者您使用 check-sso，就像 Sébastien 已经提到的静默模式。
You can configure a silent check-sso option. With this feature enabled, your browser won’t do a full redirect to the {project_name} server and back to your application, but this action will be performed in a hidden iframe, so your application resources only need to be loaded and parsed once by the browser when the app is initialized and not again after the redirect back from {project_name} to your app. This is particularly useful in case of SPAs (Single Page Applications).
这样登录将在 iframe 中进行，应用仅初始化一次并应保留状态。
我们目前正在评估 Keycloak 作为我们的 SSO 解决方案，虽然它适用于我们基于 servlet 的应用程序，但我们的（基于 React 的）SPA 存在一个问题。
我们的设计师想要什么：举个例子，假设我们有一个电子邮件客户端 spa。用户正在写一封电子邮件，但随后分心了。当他 returns 时，SSO 会话已经超时，需要重新登录。现在应该向用户显示一个登录表单，登录后应该可以发送仍在 SPA 本地存储中的电子邮件（即重新登录而不重启 SPA 或丢失数据）。
AFAIK Keycloak 不提供身份验证-api（出于充分的理由）并使用重定向到登录页面并返回到应用程序（据我所知，对于移动应用程序，系统浏览器将是用过的）。如果我没记错的话，重定向将意味着 SPA 然后重新初始化，因此数据将丢失。
那么问题来了：我们的设计师希望使用 Keycloak 可以做什么？
如果是，会怎么做？直接发布到 Keycloak 使用的 login-url 似乎是个坏主意，因为令牌可能无法正确存储并且可能存在同源策略问题。在 iframe 或 popup-window 中执行此操作是否可行？
即使这不是最佳做法，您也可以为您的客户端启用直接授予访问权限，这样可以通过 REST 调用登录。
无论如何，关于不丢失应用程序的状态，这有点超出了 Keycloak 的范围，但是您应该能够通过在重定向 URL 中包含状态来实现这一点？
此外，如果您不希望您的应用自动重定向到登录页面，您可以使用：keycloak.init({ onLoad: 'check-sso' }) 而不是 login-required
对于回到这个问题的人，
我认为最好坚持 oAuth2/OpenId Connect for SPA 的最佳实践，目前是使用 PKCE 的“授权代码流”。
https://datatracker.ietf.org/doc/html/draft-ietf-oauth-security-topics-13
此处的正常流程需要完全重定向到身份验证服务器并返回，以便您的应用程序将完全重新初始化。或者您使用 check-sso，就像 Sébastien 已经提到的静默模式。
You can configure a silent check-sso option. With this feature enabled, your browser won’t do a full redirect to the {project_name} server and back to your application, but this action will be performed in a hidden iframe, so your application resources only need to be loaded and parsed once by the browser when the app is initialized and not again after the redirect back from {project_name} to your app. This is particularly useful in case of SPAs (Single Page Applications).
这样登录将在 iframe 中进行，应用仅初始化一次并应保留状态。