Keycloak在页面刷新时重定向到登录页

Question

我在我的Angular 5应用程序中使用keycloak JavaScript适配器，虽然我的登录和重定向功能正常，但问题是每当我刷新ng应用程序时，它都会再次要求进行keycloak登录，尽管我看到我的会话仍然活跃在/auth/realms/{image a realm name}/account。

根据keycloak JS适配器文档https://www.keycloak.org/docs/3.0/securing_apps/topics/oidc/javascript-adapter.html的理解，当init选项的onLoad设置为login-required时，如果用户已登录到Keycloak，则对客户端进行身份验证；否则显示登录页面。但在我的情况下，似乎需要一秒钟才能将我注销，因为它总是将我重定向到keycloak的登录页面。

- Random Stuff

---

你找到解决方案了吗？我和你有相同的问题。 - dmance

是的，我找到了解决方案，但我不太记得了。我认为这是因为我们的系统架构中有一层用于处理身份验证和授权，所以我得到的URL由于我们系统中的配置错误而无法工作。 - Random Stuff

Answer 1

您需要将之前登录保存的令牌传递给Keycloak初始化构造函数。如果您正在使用授权流程（标准），则还需要刷新令牌。像这样。

// load previous tokens, saved after successful login of keycloak success callback
    const token = localStorage.getItem('kc_token');
    const refreshToken = localStorage.getItem('kc_refreshToken');
    // pass to keycloak init
    keycloak.init({ onLoad: 'login-required', token, refreshToken }).then(
    success=>{
      localStorage.setItem('kc_token', keycloak.token);
      localStorage.setItem('kc_refreshToken', keycloak.refreshToken);
      //load your app from here
  });

- ahmadalibaloch

---

请勿使用本地存储来存储令牌。https://dev.to/rdegges/please-stop-using-local-storage-1i04 - Stuck

@Stuck 但是如果您查看网络请求，就会发现 KC 令牌已经可供浏览器使用，并且仅在 X 秒内有效。将其存储在本地存储或会话存储中会使情况变得更糟吗？ - Stianhn

似乎在2023年仍然是实际的。 - Adrian

通过将其存储在本地存储中，您可以永久保留令牌。其中一个问题是，如果您关闭一个标签页，然后稍后返回同一网站，您仍然会保持登录状态。这对用户来说非常不直观，因为他们期望在关闭标签页后被注销登录。 - SeverityOne

Answer 2

简述：在我的代码中，有几个原因导致初始化函数第二次没有使用参数调用。要注意这一点！

顺带一提，我遇到了类似的问题，但现在看来我已经解决了这个问题。除了@ahmadalibaloch的答案（传递已知的令牌到init函数中），我还按照这个很好的指南：https://dev.to/matejbucek/secure-svelte-with-keycloak-42g3（针对Svelte-Kit），其中checkParams函数检查重定向URL以再次调用init函数（使用令牌）。

我的代码出现了两个问题，你可以寻找并尝试修复，这是由于重定向URL中的自定义搜索参数引起的。

mypage.tld/foo?myparam=0#keycloak-redirect-params

这种方式，checkParams函数无法正确工作。但是，myparam=0被用作替代访问字符串（考虑链接共享），因此我的代码在keycloak还没有准备好时就放弃了（第二次），即init函数没有再次调用，而是使用了搜索参数。我的建议：如果其他答案不足够，请尝试找出为什么init函数没有像应该那样再次调用。我知道这很具体，但对我来说很难发现，所以也许会有所帮助。

- juliusplus

Answer 3

您需要登录到您的 keycloak 客户端，选择领域，在侧边栏导航到 AUTHENTICATION 选项卡，选择 FLOW 菜单选项卡，然后将 cookie 设置更改为替代或必需。

- Jeremiah Udoh