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

Posted 2023-03-27

【中文标题】使用带有身份服务器 4 的 oidc 客户端进行静默登录

【英文标题】：silent sign in using oidc client with identity server 4

【发布时间】：2017-05-26 06:33:20

【问题描述】：

我正在尝试在 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 中有更好的方法来做到这一点，那就更好了。

【问题讨论】：

我遇到了类似的问题。你查到真相了吗？

您将如何使用automaticSilentRenew: true 完成此任务？

我也有同样的问题，在进行 SilenceRenew 时，有时 API 返回 401 并且我的应用程序“重新加载”页面

在 devtools 中，您的控制台是否显示任何错误？

【参考方案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();
       );