Question / Issue
I'm using Identity Server for Single Sign On, my Client application is in ReactJs embedded with Redux. I'm using redux-oidc npm node module to implement the Identity Server functionality as mentioned in https://github.com/IdentityModel/oidc-client-js/wiki
My oidc config is
var settings = {
authority: 'https://localhost:2025/core',
client_id: 'TVA',
silent_redirect_uri: 'http://localhost:3000/silent-renew.html',
post_logout_redirect_uri: 'http://localhost:3000',
redirect_uri: `http://localhost:3000/callback`,
response_type: 'id_token token',
scope: 'openid payroll',
acr_values: `tenant:Payroll`,
accessTokenExpiringNotificationTime: 4,
automaticSilentRenew: true,
filterProtocolClaims: true
};
If I use the in-built method signoutRedirect, its again redirecting to the application's initial landing page, but if I directly trigger the end session it redirects to the Identity Server Login Page (i.e., Once the application is successfully logout, the Identity Server redirects to the root URI and then it redirects to the Login page).
Issue: Its not Signout the application
userManager.signoutRedirect()
.catch(function (error) {
console.error('error while signing out user', error);
});
Fine: Signout's perfectly
const path = 'https://localhost:2025/core/connect/endsession?id_token_hint=${token}&post_logout_redirect_uri=http://localhost:3000';
document.location.href = path;
Kindly assist me how to signout using userManager.signoutRedirect() ???
Related
We have two .net core with angular applications where we have used Openid server and client
https://localhost:80 : Parent Application
https://localhost:85 : Child Application
We want to authenticate the child application within the parent application.
In the angular end, we used oidc-client and updated the UserManager dynamically inside the child application.
The flow we are trying to achieve is
Login Page child application (https://localhost:85) -> Click Login -> it redirects to parent app Login Page (https://localhost) -> entering credentials and After successful signing in the redirection URL will be (https://localhost:85) and it will grant access to that child application.
While redirecting to the child application by redirect URL after login it throws the below error "Authority mismatch on settings vs. signin state"
[![enter image description here][1]][1]
Can someone help me with the flow of authentication of multiple client applications via openid client ?
Error: authority mismatch on settings vs. signin state
at t [as _processSigninParams] (oidc-client.min.js:1:57198)
at t [as validateSigninResponse] oidc-client.min.js:1:55646)
at oidc-client.min. js:1:27449 at
ZoneDelegate. invoke (zone, js:372รท26) at Object.onInvoke (core.mjs:26356:33) at
ZoneDelegate. invoke (zone. js:371:52)
at Zone.run (zone. js:134:43)
at zone. js:1275:36 at
ZoneDelegate. invokeTask (zone. js:496:31)
at Object.onInvokeTask (core.mijs:26343:33)
Initially, the child application will have the below config
this.ChildAppConfig = {
authority: 'https://localhost',
client_id: 'child-spa',
redirect_uri: `https://localhost/signin-callback`,
scope: 'profile openid offline_access',
response_type: 'code',
post_logout_redirect_uri: `https://localhost/signout-callback`,
silent_redirect_uri: `https://localhost/silent-renew`,
automaticSilentRenew: false,
revokeAccessTokenOnSignout: true,
accessTokenExpiringNotificationTime: 60,
};
When I want to grant access to a child application via a parent application I will redirect it to the parent application, where the parent application will have the below config, and once authenticated it should redirect back to the child application
grantAccessConfig = {
authority: 'https://localhost:85',
client_id: 'spa',
redirect_uri: `https://localhost/signin-callback`,
scope: 'profile openid offline_access',
response_type: 'code',
post_logout_redirect_uri: `https://localhost/signout-callback`,
silent_redirect_uri: `https://localhost/silent-renew`,
automaticSilentRenew: false,
revokeAccessTokenOnSignout: true,
accessTokenExpiringNotificationTime: 60,
};
Ok i had this error before with Reactjs oidc-react and .net backend. the problem was that the configuration defined in SigninCallBack.js(here i init the storage and redirect) was not same as the configuration defined in identity server. this config was from the test app that throws that error
import React from 'react'
import { WebStorageStateStore } from 'oidc-client-ts';
import { UserManager } from 'oidc-react';
const SigninCallBack = () => {
var config = {
userStore: new WebStorageStateStore({store: window.localStorage}),
authority: "https://localhost:9001/",
client_id: "myappid",
redirect_uri: "https://localhost:3000/signincallback",
client_secret: "thesecretkey_but_i_used_PKCE",
response_type: "code",
scope:"openid profile someApi",
post_logout_redirect_uri : "https://localhost:3000/signout-callback-oidc",
loadUserInfo: true
};
var userManager = new UserManager(config);
userManager.signinCallback().then(res => {
window.location.href = '/';
});
}
export default SigninCallBack;
and mine was the client url which here i was defined with http but in the identityserver config i defined it with https. however it could be any of them such as response type ,client Id etc.
I'm using MSAL JS in order to authenticate users in react application developed using REACT. Sometimes login works perfectly, redirecting users to the home page of the app. Other times login popup opens, users insert their login but then login procedure fails with this error:
hash_empty_error: Hash value cannot be processed because it is empty.
Please verify that your redirectUri is not clearing the hash.
I know this issue was raised before but never seen proper solution how to overcome this error
What worked for me was to set the redirectUri to a blank page or a page that does not implement MSAL. If your application is only using popup and silent APIs you can set this on the PublicClientApplication config like below:
export const msalConfig = {
auth: {
clientId: process.env.REACT_APP_CLIENTID,
authority: `https://login.microsoftonline.com/${process.env.REACT_APP_TENANTID}`,
redirectUri: 'http://localhost:3000/blank.html'
},
cache: {
cacheLocation: "localStorage"
}
}
If your application also needs to support redirect APIs you can set the redirectUri on a per request basis:
msalInstance.loginPopup({
redirectUri: "http://localhost:3000/blank.html"
})
export const msalConfig = {
auth: {
clientId: process.env.REACT_APP_B2C_CLIENT_ID, // This is the ONLY mandatory field that you need to supply.
authority: b2cPolicies.authorities.signIn.authority, // Choose SUSI as your default authority.
knownAuthorities: [b2cPolicies.authorityDomain], // Mark your B2C tenant's domain as trusted.
redirectUri: '/home', // You must register this URI on Azure Portal/App Registration. Defaults to window.location.origin
postLogoutRedirectUri: "/", // Indicates the page to navigate after logout.
navigateToLoginRequestUrl: false, // If "true", will navigate back to the original request location before processing the auth code response.
}}
This is the msalConfig.
When I input browser's address bar '/dashboard', and I met MSAL signin screen.
After the success of authentication I only navigate to '/home' route as defined in configuration.
I want to navigate '/dashboard' (the input url, not fixed configuration url) after success of authentication.
How can I change the msalConfig for that?
Please help me.
You probably need to set 'navigateToLoginRequestUrl : true'.
It should redirect to the page (post authentication) that initiated the request.
I'm using IdentityServer4(.NET Core API) and 'oidc-client' in Angular, In which I'm using custom login and logout urls, not default identityserver4 urls, So in this scenario silent-refresh request from 'oidc-client'. it returns 302, Still token is getting expired after sometimes automatically
IdentityServer4:
services.AddIdentityServer(opt =>
{
opt.UserInteraction.LoginUrl = "/User/Login";
opt.UserInteraction.LogoutUrl = "/User/Logout";
opt.Events.RaiseErrorEvents = true;
opt.Events.RaiseFailureEvents = true;
opt.Events.RaiseInformationEvents = true;
opt.Events.RaiseSuccessEvents = true;
})
oidc-client:
getClientSettings(): UserManagerSettings {
return {
authority: localStorage.getItem('authorizationRoot'),
client_id: 'MileTMSAngapp',
redirect_uri: localStorage.getItem('redirectUri'),
post_logout_redirect_uri:
localStorage.getItem('postLogoutRedirectUri'),
response_type: 'id_token token',
scope: 'openid profile MileTMS',
filterProtocolClaims: false,
loadUserInfo: true,
automaticSilentRenew: true,
silent_redirect_uri: localStorage.getItem('silentRedirectUri')
};
}
'Silent-Callback':
return this.manager.signinSilentCallback()
.then(doSomething => 'done');
what kind of error are you seeing in the console?
With the minimal information that you have provided, my guess is that you are facing this issue. Hopefully, this helps.
IdentityServer Session cookie is not sliding
I am using angular 5 with oidc-client and identity server 4. Is session timeout supported in oidc-client or i need to implement it manually ?
By Session Timeout i mean, the user will be logged out after sometime of inactivity
for your SPA applications you can use the implicit flow, refresh token is not possible automatically but oidc-client.js can make it easy for you. you can use the silent refresh, oidc-client will send the active cookie session to get a new access_token just before the expiration of the new one. you need only to configure it
const config = {
authority: xxxxx,
client_id: xxxxx,
popup_redirect_uri: `${OidcConfig.clientRoot}/assets/html/popup-login-redirect.html`,
scope: 'openid profile',
response_type: 'id_token token',
post_logout_redirect_uri: `${OidcConfig.clientRoot}?postLogout=true`, // delet all stored tokens after logout
userStore: new WebStorageStateStore({ store: window.localStorage }),
automaticSilentRenew: true, // enable silent refresh
silent_redirect_uri: `${OidcConfig.clientRoot}/assets/html/silent-refresh-redirect.html` // here when you can get the new tokens
};
here is the content of silent-refresh-redirect.html
<script src="https://cdnjs.cloudflare.com/ajax/libs/oidc-client/1.5.1/oidc-client.min.js"></script>
<script>
var config = {
userStore: new Oidc.WebStorageStateStore({ store: window.localStorage })
};
new Oidc.UserManager(config).signinSilentCallback()
.catch((err) => {
console.log(err);
});
</script>