I'm confused how I can get access tokens and user info details when using azure ad scopes with oidc-client.js.
I have the following scope against my app in the portal...
I then have my user manager settings set up as follows....
var settings: UserManagerSettings = {
authority: `https://login.microsoftonline.com/${tenantId}`,
client_id: clientId,
redirect_uri: "http://localhost:3000/authcallback",
post_logout_redirect_uri: "http://localhost:3000/authcallback",
response_type: "token id_token",
scope: `api://${clientId}/access_user_data openid`,
popup_redirect_uri: "http://localhost:3000/authcallback",
silent_redirect_uri: "http://localhost:3000/authcallback",
automaticSilentRenew: true,
loadUserInfo: true,
metadata: {
userinfo_endpoint: "https://graph.microsoft.com/oidc/userinfo",
authorization_endpoint: `https://login.microsoftonline.com/${tenantId}/oauth2/v2.0/authorize`,
issuer: `https://login.microsoftonline.com/${tenantId}/v2.0`,
jwks_uri: `https://login.microsoftonline.com/${tenantId}/discovery/v2.0/keys`
}
};
When I login with signinRedirect I get an access_token returned to my callback, however the call to https://graph.microsoft.com/oidc/userinfo fails with unauthorized when doing getUser().
oidc-client.min.js:1 GET https://graph.microsoft.com/oidc/userinfo 401 (Unauthorized)
The access token does appear to work with my api that requires the api://${clientId}/access_user_data scope.
The discovery document here lists the following available scopes
"scopes_supported": [
"openid",
"profile",
"email",
"offline_access"
]
Which I thought would have worked as I am also including the openid scope. Note that if I only have the openid scope like so scope: "openid", getUser() works, however it doesn't have the scope I need for calling my api.
What am I doing wrong here?
Thanks,
Had the Same issue after some research tried setting loadUserInfo to false that resolved my problem can please try the same
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 have a React-Native application that I am trying to add Auth0 login. So far I have it so it will log in to the app but it is providing a JWT that when I check the jwt.io debugger I get an error message about missing data and the data section is empty. My JWT looks like <string>..<string> when IIRC it should be <string>.<string>.<string> where the middle string that is missing is the data value.
My question is what am I missing that is causing the no data to be in my JWT?
Below is my code with the credentials removed.
// Setup
import Auth0 from 'react-native-auth0'
const auth0 = new Auth0({ domain: '<>', clientId: '<>' })
// Code inside login function
auth0.webAuth
.authorize({
scope: 'openid profile email'
})
.then(credentials => {
// Using this to check the token for the correct format
Alert.alert(credentials.accessToken)
// This is setting it to a global state store where I can access it from elsewhere
globalStorage.set('accessToken', credentials.accessToken)
})
navigation.navigate('list')
Edit**
Here is an example payload/data from a working token I am getting from my Vue.js app
{
"iss": "https://<my domain>.us.auth0.com/",
"sub": "auth0|<user ID>",
"aud": [
"<my audience>",
"https://<my domain>.us.auth0.com/userinfo"
],
"iat": 1661293312,
"exp": 1661379712,
"azp": "<>",
"scope": "openid profile email",
"permissions": [<bunch in here removed for clarity>]
}
Finally figured it out, I needed an audience but it doesn't get added like the package I used with Vue.js but instead gets added to the authorize function. Example code here:
.authorize({
scope: 'openid profile email',
audience: '<>'
})
I am successfully using AWS Amplify and AWS Cognito for my spa authorization.
The only issue is that when I refresh the page, the auth seems to be lost, even if I see amplify and cognito items in LocalStorage.
This is my configuration section:
Amplify.configure({
Auth: {
oauth: {
domain: 'xxxxx.auth.eu-west-1.amazoncognito.com',
scope: ['phone', 'email', 'profile', 'openid'],
responseType: 'code',
oauth.redirectSignIn: 'http://localhost:3000/',
oauth.redirectSignOut: 'http://localhost:3000/',
},
region: process.env.REACT_APP_REGION,
userPoolId: process.env.REACT_APP_USER_POOL_ID,
userPoolWebClientId: process.env.REACT_APP_USER_POOL_WEB_CLIENT_ID,
storage: localStorage,
},
});
In practice, I don't know how to ask amplify to use localStorage when user is authenticated and app restarts (page reload).
Possibly I should use Auth.currentAuthenticatedUser(), but I suppose I can't call it instead of Auth.configure()...
You can fetch the user from storage by calling Auth.currentAuthenticatedUser().
It isn't properly documented but you can refer to the implementation to see the behavior (amplify team must believe in self-documenting code).
I'm using a redirect_uri to choose the page that's opened after Google Authentication. It works fine in dev, but not in production (both are using the same OAuth Client ID). I've added both the localhost and the production links in the Authorized redirect URIs section of the Client ID.
The production error looks like this (I'm replacing my actual domain with test.com). I'm confused because the link in the error matches the link I've added to the Authorized redirect URIs:
Error: redirect_uri_mismatch. The redirect URI in the request,
https://www.test.com/target does not match the ones authorized for the OAuth client.
So this works:
const gapiClientConfig: GapiClientConfig = {
client_id: CLIENT_ID,
discoveryDocs: [ DISCOVERYDOCS ],
scope: [ SCOPES ].join(' '),
ux_mode: 'redirect',
redirect_uri: 'http://localhost:8888/targetPage
};
But this does not:
const gapiClientConfig: GapiClientConfig = {
client_id: CLIENT_ID,
discoveryDocs: [ DISCOVERYDOCS ],
scope: [ SCOPES ].join(' '),
ux_mode: 'redirect',
redirect_uri: 'https://www.test.com/targetPage
};
If I remove the path from the link, it works.
redirect_uri: 'https://www.test.com'
It seems as though the changes to the OAuth client settings in the Google Cloud Console may not take effect immediately. Everything is working now.
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() ???