So I recently used the quickstart method from Azure to make a JS app which authenticates using the MSAL.js library. I am able to authenticate using the normal users in AD, however when adding in google as an external identity provider, I get the Authorization error:
"Error 400: redirect_uri_mismatch
The redirect URI in the request, https://login.microsoftonline.com/te/{tenant-id}/oauth2/authresp, does not match the ones authorized for the OAuth client...."
I have checked the URI in my JS app, on Azure and added it in the Google develops console to no avail. I have followed the documentation as per: https://learn.microsoft.com/en-us/azure/active-directory-b2c/identity-provider-google
I have tried fiddling with everything and don't know what to do to fix it. Keep in mind that when I created the Azure account, it automatically made my tenant name "Default directory" and my Primary domain as "{FirstName}{EmailDomain}#onmicrosoft.com". I since then change my tenant name to "NewTenant" (I will be changing all names for the purpose of this question as I would like to not reveal any actual details where possible).
To conceal my details I'll be making "{FirstName}": "Bob", and "{EmailDomain}": "mydomain"
JS code:
const msalConfig = {
auth: {
clientId: '{ClientId}',
authority: 'https://login.microsoftonline.com/{TenantId}',
domain: 'bobmydomain.onmicrosoft.com',
instance: 'https://bobmydomain.b2clogin.com/tfp',
redirectUri: "http://localhost:3000/"
},
cache: {
cacheLocation: 'sessionStorage',
storeAuthStateInCookie: false
}
};
Azure:
Azure redirect URIs
Google developer console:
Google redirect URIs Bear in mind I fiddled with the HTML so that I could get a nice screenshot. I have also configured the ClientID and ClientSecret for Google auth in the Azure external identity provider portal.
EDIT: http://localhost:3000/ was also added as a redirect URI to the Google dev console but also to no avail
Any help would be appreciated.
Related
I am trying to run the WebApp B2C sample:
https://github.com/Azure-Samples/active-directory-aspnetcore-webapp-openidconnect-v2/tree/master/1-WebApp-OIDC/1-5-B2C
When I try to login, I get the following error:
IDX40002: Microsoft.IdentityModel does not support a B2C issuer with 'tfp' in the URI. See https://aka.ms/ms-id-web/b2c-issuer for details.
If I edit the Instance to https://myHost.b2clogin.com I get:
AADSTS50011: The redirect URI 'https://myHost.b2clogin.com/1c2009bb-7e35-4a0e-9f22-xxxxxxxxx/oauth2/authresp' specified in the request does not match the redirect URIs configured for the application 'c24b0337-0bd9-45ee-8376-xxxxxxxxx'. Make sure the redirect URI sent in the request matches one added to your application in the Azure portal. Navigate to https://aka.ms/redirectUriMismatchError to learn more about how to fix this.
Edit:
These are my redirects:
I tried to reproduce the same in my environment and got the below results:
I deployed custom policy starter pack via IEF Setup App by entering my Azure B2C tenant name like below:
When I checked that in Portal, custom policies are created successfully like below:
Now I registered one Azure AD B2C app named webapp1 as below:
I added redirect Uri to the above application like below: https://localhost:44316/signin-oidc
Now, I followed the same link that you mentioned and deployed one sample B2C web application by modifying appsettings.json file like below:
"AzureAdB2C": {
"Instance": "https://sridevib2c.b2clogin.com",
"ClientId": "9986e76d-bxx7-4x6x-bxx7-3d8xxxxx9a45",
"Domain": "sridevib2c.onmicrosoft.com",
"SignedOutCallbackPath": "/signout/B2C_1A_SIGNUP_SIGNIN",
"SignUpSignInPolicyId": "B2C_1A_SIGNUP_SIGNIN",
"ResetPasswordPolicyId": "B2C_1A_PASSWORDRESET",
"EditProfilePolicyId": "B2C_1A_PROFILEEDIT" // Optional profile editing policy
//"CallbackPath": "/signin/B2C_1A_SIGNUP_SIGNIN" // defaults to /signin-oidc
},
JSON file:
When I ran the above web application, it took me to below web page:
After selecting Sign Up/In, I got the login screen like below:
When I entered my credentials, I logged in to the application successfully like below:
When I clicked on Sign Out, it showed me below screen by signing me out:
After a long research I found this article/sample, where the Microsoft.Identity.UI framework is replaced with the Microsoft.AspNetCore.Authentication.AzureADB2C.UI.
However, with the https://myDomain.b2clogin.com url I still get the same error, using the custom domain it works, that's enough for me.
I have an Azure AD B2C tenant setup with an Angular app on the front-end using Authorization Code Flow with PKCE and a back-end api. Everything is working fine. I now have a need to allow the user to access certain pages on the front-end anonymously. I would prefer to still protect the apis these pages will call using the same access token.
I have followed the article here to set up Client Credentials flow. I am able to get an access token successfully using Postman and use it to call my back-end apis fine. However, when I try to do the same from the Angular app, I get the following error:
{"error":"invalid_request","error_description":"AADB2C99067: Public Client XXXXX-XXXXXX is not supported for Client Credentials Grant Flow\r\nCorrelation ID: 2b3346ef-1828-4900-b890-06cdb8e0bb52\r\nTimestamp: 2022-07-28 04:12:21Z\r\n"}
Below is the code snippet I am using in Angular to retrieve the access token.
const urlencoded = new URLSearchParams();
urlencoded.set('grant_type', 'client_credentials');
urlencoded.set('client_id', '<clientid>');
urlencoded.set('client_secret', '<clientsecret>');
urlencoded.set('scope', '<scope>');
const httpOptions = {
headers: new HttpHeaders({ 'Content-Type': 'application/x-www-form-urlencoded' }),
};
const url = 'https://<b2ctenant>.b2clogin.com/<b2ctenant>.onmicrosoft.com/<customPolicy>/oauth2/v2.0/token';
return this.httpClient.post(url, urlencoded, httpOptions);
Any ideas what could be missing?
Thanks!
Though azureadb2c supports client_credential flow.One may not use them with SPA apps.
This scenario is not supported by MSAL.js. Client credential flow/ grant type will not work in SPAs(Angular) because browsers cannot securely keep client secrets.
As they may end up in the browser, visible to everyone and to attackers that load them.
Note:As the application's own credentials itself are being used, they must be kept safe - never publish that credential in your source
code
If you are using it for web app , please make sure to select the platform as web or change the reply url type to be web.
"replyUrlsWithType": [
{
"url": "https......",
"type": "Web"
},
]
Please refer :
Configure authentication in a sample Angular SPA by using Azure
Active Directory B2C | Microsoft Docs
OAuth 2.0 client credentials flow on the Microsoft identity platform- Microsoft Entra | Microsoft Docs
I'm creating an angular application that should authenticate with MS Azure AD single Tenant App which should be used only in one organization. Below are the configs which I have tried
auth: {
clientId: 'MY_CLIENT_ID',
// authority: 'https://login.microsoftonline.com/MY_TENANT_ID',
//authority: 'https://login.microsoftonline.com/MY_ORGANIZATION_DOMAIN',
authority: 'https://login.microsoftonline.com/organizations',
redirectUri: 'http://localhost:6735'
},
All thes above ways of authority I have tried. It goes to the login page of Microsoft but after giving correct credentials it redirects with some code in the URL and login doesn't happen.
http://localhost:6735/#code=0.ASgAmOTRM_cEXkaKjvmSz2YuZyqUYHleyNlFoNYtQ5kOUEUAAAA.AQABAAIAAAD--DLA3VO7QrddgJg7WevrHDMc_BSj9GrzkrZl2zT2QVp1Hml8h7qs1PSWM_umvMyKRk5U0C7IbDSpdEpL9SGjWzBFHBXBXh10eLEioVh1N8-hXeNyfLJFSqXShYPooCX8UnlUnIQqgFhULy_o1f7ybLLbMELBomOnJZQKZuJoxj6UJgtERnAE1TZ5-nx4YkPHSrlOD5aYSF6Pziu2Xfh8UOMArIUMAoXe_RUoqULKSIHFsxXypPpCNDo1ddWsxId96BbDdPhHix2IWCuz3SNtKC6i_22qiQSxHJnT3NlcoxyMS0-9f9tSMSEOmrzCU0y5mbuw7-OGYPO8Na3juGParCuPQhE7ZJyXcwFkKodEdGs-C1U-f5Bc_imtik4B8x6sRB2pa-DOAueRQHsLdUUBQn6w5xRmZ97KKXxuL0A59EHbNhNu59EFoVJB6zTTT3hBHLFg7qL9g2nkfZLAlfpp9IfqnsoZVl9xT0CIbl7NvsRFnjpsyp6Sw4oFvyEHiXuRvKLkl3Jz8O56PJody2hHEeqXuQvnWbZ9nk00MPOvArQ7bKyoCusCPQQp64uoPSLW9G389a3ihHLiiNlzJik2dHWjez2wBpSPwZCOingPRi3Mtkh5pIbxfijejQmWZlXB_wf_GaNPYPGNRXYygeo-2OZ9koWDKhQ5S6GP5ktjGPfDtlh6EJNCHAIuuHbK2IN2vjbxdO4_YVLX1NKq0Hh51B4-zNdsiFlZuVsy5RyA3ZQZGsnR1NIKV_wm5jMmdDsgAA&client_info=eyJ1aWQiOiJlYzczZDQ5OS1iYzFiLTRhZWUtYjMyZi0xYjlmOTMyODRiNjAiLCJ1dGlkIjoiMzNkMWU0OTgtMDRmNy00NjVlLThhOGUtZjk5MmNmNjYyZTY3In0&state=eyJpZCI6IjY3YWVjYjVkLWE5YjUtNDBhMy1iZDE5LWRmYmNmNjcxNTkwZiIsIm1ldGEiOnsiaW50ZXJhY3Rpb25UeXBlIjoicmVkaXJlY3QifX0=&session_state=9e6ae9e7-45ae-4fee-b4b2-921f628093ec
Please check if any of the below is your workaround
If your application audience is a single tenant, you must provide an authority with your tenant id as you tried first:
auth: {
clientId: 'your_client_id',
authority: 'https://login.microsoftonline.com/{your_tenant_id}'
}
};
By default, MSAL is configured to set the redirect URI to the current page that it is running on. If you would like to receive the authorization code on a different page than the one running MSAL, you can set this in the configuration. Any redirect URI used must be configured in the portal registration
If it is SPA, please check if you have selected platfom as SPA in app registration in portal and check the URIs type in the manifest file to be Spa . Make sure you do not have multiple platforms configured in azure (for eg both SPA & Web App for same localhost uri).
Try to give the redirect uri like this with ‘/’ at the end :http://localhost:4200/ or http://localhost:6735/ or redirecturi:'/' and make sure you configured the same uri in the application code and try again .
Make sure your client id and tenant id are given correctly. Local host is probably used while in development.If it still doesn’t work configure with https scheme in redirect uri in both app and in portal.
Reference:
AzureAD/microsoft-authentication-library-for-js (github.com)
Quickstart: | Microsoft Docs
We have the following Azure AD B2C Application (which we will call aadb2c) with the following settings
Include web app/ web API: YES
Allow Implicit Flow: YES
Reply Url:
- https://localhost:44339/
- https://productionURL.com
- https://productionURL.com/
App ID URI (which is optional): none
Native CLient: NO
This Application is what our website https://productionURL.com uses to login it's users with azure AD B2C.
However, on production we keep on getting the error:
The redirect URI 'productionURL.com' provided in the request is not registered for the client id 'aadb2c'
According to this we should add the link to out reply url.
But as you can see above, we already included https://productionURL.com in the "Reply URL" section
of the Azure AD B2C blade.
What could be causing this error to happen? How do we resolve the redirect URI request not registered error?
It needs to be configured in the code as well and you need to make sure that the protocols match. This can also happen if there's a mismatch with the tenant ID or the app ID.
Check the B2C callback request in Chrome DevTools > Network with "Preserve log" to see what URL is being returned. This should give you insight into the problem.
As an extra measure to ensure that the protocols are matching, you can add:
if (context.ProtocolMessage.RedirectUri.Contains("http:"))
{
context.ProtocolMessage.RedirectUri = context.ProtocolMessage.RedirectUri.Replace("http:", "https:");
}
After hours looking at our code and finding no traces of the url without any protocol or any trace of "http:", we now had to look at our deployment orchestrator.
Apparently in Octopus we are deploying the app with an incorrect URI: it's missing the protocol "https://"
I am trying to setup a authentification for POST requests on my Node.js server hosted # Azure.
I am using this example:
passport.use(new OIDCStrategy({
callbackURL: config.creds.returnURL,
realm: config.creds.realm,
clientID: config.creds.clientID,
clientSecret: config.creds.clientSecret,
oidcIssuer: config.creds.issuer,
identityMetadata: 'https://login.microsoftonline.com/TenantGuidOrTheWordCOMMON/v2.0/.well-known/openid-configuration',
skipUserProfile: config.creds.skipUserProfile,
responseType: config.creds.responseType,
responseMode: config.creds.responseMode,
(tenant: "Guid from AzureAD-Endpoints-Button"),
(validateIssuer: false/true)
}, (...)
Although my code redirects me to a "https://login.microsoftonline.com" page (which is nice), after entering my email-address it immediately redirects me somewhere else.
There I get an error in the browserUrl: "the client does not exist"...
and it says I should create an application # "https://apps.dev.microsoft.com".
WHY? I have a AppService "MyService", an Azure AD within the same subscription and within the Azure AD an "App registration" for "MyApp".
What is now this cruel apps.dev.microsoft site? Why is there not my registered "MyApp" shown and Vice versa?
What do I have to enter within "oidcIssuer"? the MyApp.ApplicationId? The (apps.dev.microsoft.com)-Application.ApplicationId? The AzureAD-ClientId? The AzureAD-IssuerUrl?
The same question for the clientSecret
Whats the difference between using identityMetadata with an ID instead of "common" + validateIssuer:true against using identityMetadata with "common", validateIssuer:false + tenant:"myTenant(Guid?)"
When I Use "ExpressSettings" within Authentication/Authorization-->AzureAD why can I not find the Application I defined in Azure AD?
Do I have to activate the Graph API (I dont know anything about it yet)
Are there good alternatives protecting my express.post endpoint with authentification in Azure AD? (ADAL seems to be for resources)
I dont get all this settings, properties and portals of Microsoft I am just overhelmed by all this... (not to mention there is also an "OLD" portal)
The next days I will try this Azure Step-By-Step Guide maybe It will help me somehow...
For this example you are using, you don't need to modify the params in OIDCStrategy object. Instead, you need to config your AAD settings in client_config_*.js. files. Just like the document describes at https://github.com/AzureAD/passport-azure-ad/tree/master/examples/login-oidc.
And BTW, we manage our AAD applications on the Classic Portal.
Like my answer to "Has anyone successfully used Azure AD to authenticate users for a Node.js web application?"
I setup my authentification like this instead (without code) in the new Azure Portal:
host my Node.js Server
add an AD to the subscription
Register new application within the AD
Add "https://YourNodeJS.azurewebsites.net/.auth/login/aad/callback" as Reply URL
In AppServices, pick your Node.js Server
In Settings go to Authentication/Authorization
Activate AAD
Use Advanced Mode of AAD
Enter the ClientID (GUID) of the application registered above in AD
As issuerURL enter this link: https://sts.windows.net/YourADGuid/ (you can see the GUID within "Endpoints" if you look back at your application registered in AD above)