使用 oidc 客户端与身份服务器 4 进行静默登录

Question

我正在尝试在 oidc-client 中实现静默登录以与 Angular 2 一起使用

如何使用 oidc 客户端静默检查用户是否已登录（idsvr4）并显示登录详细信息。

以下代码有效，但我需要刷新页面

idsvr 4 客户端

  // JavaScript Client
            new Client
            {
                ClientId = "js",
                ClientName = "JavaScript Client",
                AllowedGrantTypes = GrantTypes.Implicit,
                AllowAccessTokensViaBrowser = true,


                RedirectUris = { "http://localhost:5002/callback.html" },

                PostLogoutRedirectUris = { "http://localhost:5002/index.html" },
                AllowedCorsOrigins = { "http://localhost:5002" },

                AllowedScopes =
                {
                    IdentityServerConstants.StandardScopes.OpenId,
                    IdentityServerConstants.StandardScopes.Profile,
                    "api1",

                },
                    RequireConsent=false,
                AllowOfflineAccess = true
            }

客户端代码

    var config = {
     authority: "http://localhost:5000",
    client_id: "js",
    redirect_uri: "http://localhost:5002/callback.html",
    silent_redirect_uri: "http://localhost:5002/callback.html",
    response_type: "id_token token",
    scope: "openid profile api1 offline_access",
    post_logout_redirect_uri: "http://localhost:5002/index.html",



    // Number of seconds before the token expires to trigger
    // the `tokenExpiring` event
    accessTokenExpiringNotificationTime: 4,

    // Do we want to renew the access token automatically when it's
    // about to expire?
    automaticSilentRenew: false,
   
    // Do we want to filter OIDC protocal-specific claims from the response?
    filterProtocolClaims: false,

    // use localStorage
    userStore: new Oidc.WebStorageStateStore({ store: window.localStorage })
    };
    var mgr = new Oidc.UserManager(config);


    // You can hook a logger to the library.
    // Conveniently, the methods exposed by the logger match
     // the `console` object
    Oidc.Log.logger = console;

    // When a user logs in successfully or a token is renewed, the `userLoaded`
    // event is fired. the `addUserLoaded` method allows to register a callback to
    // that event
    mgr.events.addUserLoaded(function (loadedUser) {
    console.log("$$$$$$$$$$$$$$$$$$$$$$$ added");
    });

    // Same mechanism for when the automatic renewal of a token fails
    mgr.events.addSilentRenewError(function (error) {
    console.error('$$$$$$$$$$$$$$$$$$$$$$$ error while renewing the access    token', error);
    });

    // When the automatic session management feature detects a change in
    // the user session state, the `userSignedOut` event is fired.
    mgr.events.addUserSignedOut(function () {
    alert('The user has signed out');
    });

    mgr.getUser().then(function (user) {
    if (user) {
        log("User logged in", user.profile);
    }
    else {
        log("User not logged in");
       // log("*****************************************************");
        mgr.signinSilent()
        .then(function (newUser) {
            console.log("doneeeeeeeeeeeeeeeeeeeee");
            console.log(newUser);
            console.log(newUser.profile);
        }).catch(function (e) {
            console.log("========  " + e);
        });;
        mgr.signinSilentCallback().then(function (newUser) {
        console.log("doneeeeeeeeeeeeeeeeeeeee");
        console.log(newUser);
        console.log(newUser.profile);
    }).catch(function (e) {
            console.log("&&&&&&&&&&&&  "+e);
        });

    }


    });

在silentSignIn的任一方法中都没有返回用户

我想知道用户是否登录并在客户端打开后立即检索信息。

或者如果有更好的方法在 Angular 2 中做到这一点那就更好了。

Answer 1

我也有同样的问题。我设法通过使用以下signin()方法并通过管理进程登录响应来解决这个问题：

function signin() {
    manager.createSigninRequest().then(function (req) {
        window.location = req.url;
    }).catch(function (err) {
        log(err);
    });
}


manager.processSigninResponse().then(function (response) {
    log("signin response success", response);
}).catch(function (err) {

});

manager.events.addUserLoaded(function (user) {
    manager.getUser().then(function () {
        log("User logged in", user.profile);
    });
});



function api() {
      mgr.getUser().then(function (user) {
    var url = "http://localhost:5001/identity";

    var xhr = new XMLHttpRequest();
    xhr.open("GET", url);
    xhr.onload = function () {
        log(xhr.status, JSON.parse(xhr.responseText));
    }
    xhr.setRequestHeader("Authorization", "Bearer " + idToken);
    xhr.send();
       });
}