Keycloak SSO - 重定向过多答案

【问题标题】：Keycloak SSO - too many redirectsKeycloak SSO - 重定向过多
【发布时间】：2018-10-17 22:08:00
【问题描述】：

当使用 Keycloak-js（版本：4.0.0）在 Angular4 中创建会话时，SSO 不起作用

以下是重新创建此内容的步骤

将 Keycloak 与 Angular 4 应用程序集成（例如：https://github.com/mauriciovigolo/keycloak-angular 或 https://github.com/cternes/slackspace-angular2-spring-keycloak/tree/master/frontend）
当用户尝试登录时，他将被自动重定向到 Keycloak 登录页面
创建会话后，尝试通过其他应用登录，例如使用 Keycloak 或 Jenkins 的 Grafana
重定向过多（Keycloak 运行在 8081 端口，Grafana 运行在 3000）

请求网址：

http://localhost:8081/auth/realms/angular_keycloak/protocol/openid-connect/auth?access_type=online&client_id=client-ui&redirect_uri=http%3A%2F%2Flocalhost%3A3000%2Flogin%2Fgeneric_oauth&response_type=code&scope=read+write&state=wWXu1iyWXtSevSxwCFzWHPZ7oPM63Dbu5AoMBTMdjHE%3D

响应网址：

http://localhost:3000/login/generic_oauth#state=wWXu1iyWXtSevSxwCFzWHPZ7oPM63Dbu5AoMBTMdjHE%3D&session_state=6ec8255b-ed4c-4399-951c-0241ce7bebad&code=eyJhbGciOiJkaXIiLCJlbmMiOiJBMTI4Q0JDLUhTMjU2In0..lvjHquloACY0fTMxmOLeYQ.82mSmzkn4HJBSnokMEpqnZw-xkhUrKy9icZAUwVOrh8b4MP9F-8qmH42rrg0O_axTZVJYlozwWA4x9V2dQAIbi2cUgKJlsiNfJllcN8luK4PSwqOe2bp6WtMszvIeU30UW8RXVqf46hstf1dTxWZp-wocChwLaqATNqZD61u-AURLz6ItY8DQxd3hwScR1kJhfu8bJBR_Pcnbt8LIGl_nKOdaGfceoDFpBfOqGuy1AtQ-3QUwvNkBMZCSGVBYQLB.fSMESQYQKVWZfpbR1Rw47A

尝试的选项：

Angular4 和詹金斯
Angular4 和 Grafana

而以下步骤有效

直接登录 Grafana 或 Jenkins 或 KeyCloak
然后登录到 Angular 4 就可以了

由于我能够分别登录到这些应用程序中的每一个，并且 SSO 在 Grafana 和 Jenkins 之间工作，我倾向于认为问题可能出在 Keycloak-Js 适配器上。

以下是我用来创建会话的参数

  const keycloakAuth: any = Keycloak({
            url: environment.KEYCLOAK_URL,
            realm: environment.KEYCLOAK_REALM,
            clientId: environment.KEYCLOAK_CLIENTID,
            'ssl-required': 'external',
            'public-client': true,
        });

【问题讨论】：

您使用的库不使用隐式流 - github.com/mauriciovigolo/keycloak-angular/issues/43，这对于 Angular 应用程序来说真的不安全。我真的很好奇它如何在您的代码中没有客户端密码的情况下工作。使用更好的库，我的推荐manfredsteyer.github.io/angular-oauth2-oidc/angular-oauth2-oidc/…。
感谢@JanGaraj。将使用 angular oidc 进行 poc。为了澄清，Keycloak-angular 也仅使用隐式流。该问题讨论了使用隐式流管理刷新令牌。此外，在我的实现中不需要客户端密码，因为我在 keycloak 中将访问类型设置为公共
我也遇到过同样的问题。导致问题的原因是传递给 init 函数的参数。不能传递“checkLoginIframe: false”，因为它禁用了持有授权 cookie 的 keycloak 适配器 iframe。

标签： angular authentication jenkins single-sign-on keycloak

【解决方案1】：

最终，我使用 Angular-OIDC 库（隐式流）https://github.com/manfredsteyer/angular-oauth2-oidc 实现了 SSO 功能

 private configureWithNewConfigApi() {
 // URL of the SPA to redirect the user to after login
    this.oauthService.redirectUri = window.location.origin + "/index.html";

    // set the scope for the permissions the client should request
    this.oauthService.scope = "openid profile email";

    // set to true, to receive also an id_token via OpenId Connect (OIDC) in addition to the
    // OAuth2-based access_token
    this.oauthService.oidc = true;

    // Use setStorage to use sessionStorage or another implementation of the TS-type Storage
    // instead of localStorage
    this.oauthService.setStorage(sessionStorage);

    this.oauthService.clientId = "<<clientId>>";
    let url = 'https://<<keycloakhost>>:<<port>>/auth/realms/<<realmsname>>/.well-known/openid-configuration';
    this.oauthService.loadDiscoveryDocument(url).then((doc) => {
        // This method just tries to parse the token within the url when
        // the auth-server redirects the user back to the web-app
        // It dosn't initiate the login
        this.oauthService.tryLogin({});      
        console.debug('discovery succeeded', doc);

    });

感谢 Jan Garag 的suggestion

【讨论】：