Blazor WASM - There was an error trying to log you in: 'this._settings.loginMode is undefined' - azure-web-app-service

I've created a new dotnet 6 blazor wasm app with the core hosted option. The Visual Studio 2022 (v17.3.1) template creates Client, Server and Shared projects for this.
I've updated the Server project's program.cs to make use of Azure ADB2C as follows:
builder.Services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme)
.AddMicrosoftIdentityWebApi(builder.Configuration.GetSection("AzureAdB2C"));
Its appsettings.json contains the following:
"AzureAdB2C": {
"Instance": "https://mydomain.b2clogin.com/",
"ClientId": "serverprojclientidhere",
"Domain": "mydomain.onmicrosoft.com",
"Scopes": "access_as_user",
"SignUpSignInPolicyId": "B2C_1_SignUpIn"
}
In the client project, the program.cs contains the following:
builder.Services.AddMsalAuthentication(options =>
{
builder.Configuration.Bind("AzureAdB2C", options.ProviderOptions.Authentication);
options.ProviderOptions.DefaultAccessTokenScopes.Add("https://mydomain.onmicrosoft.com/api/Api.ReadWrite");
});
Its appsettings.json contains the following:
"AzureAdB2C": {
"Authority": "https://mydomain.b2clogin.com/mydomain.onmicrosoft.com/B2C_1_SignUpIn",
"ClientId": "clientprojclientidhere",
"ValidateAuthority": false
}
When I run this locally it works fine. The website loads and presents the home screen, if I select a "secured" page then I'm redirected to the ADB2C.
I have a devops pipeline that's deployed the solution to an Azure App Service (linux). If I go to the site it presents the hope page ok but on navigating to a secured page I get the following error message:
There was an error trying to log you in: 'this._settings.loginMode is
undefined'
I don't see any errors in the browser's console window.
Any ideas?

I managed to find the answer from this blog post
Resolution was to add the following to the client project's csproj file:
<ItemGroup>
<TrimmerRootAssembly Include="Microsoft.Authentication.WebAssembly.Msal" />
</ItemGroup>

Related

Microsoft.IdentityModel does not support a B2C issuer with 'tfp' in the URI

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.

Problem calling Microsoft Graph from ASP.NET Grpc service

I have two applications -
public client application (.NET Core console app), in which user gets Microsoft identity access token
web API, which tries to call Microsoft Graph on-behalf-of user, using that access token
When I call Microsoft Graph from web API, I get a MicrosoftIdentityWebChallengeUserException, which inner exception states:
"The user or administrator has not consented to use the application with ID <...> named <...>. Send an interactive authorization request for this user and resource."
I've tried:
to pre-authorize client application in service application using Expose an API tab in Azure Portal
to add client application ID in knownClientApplications array in Manifest tab
to include the scopes, needed for Microsoft Graph (e.g. "User.Read"), in the access token, obtained by the user
but it seems that this does not work and I still get the same exception.
The question is - can I somehow avoid this exceptional situation by getting all needed permissions in a user access token, before calling the GRPC service, or if not, that how do I need to handle this exception to propagate it back to the user.
Full details here. Keep following the Next Steps.
Basically, you'll need to:
Include the Microsoft.Identity.Web and Microsoft.Identity.Web.MicrosoftGraph NuGet packages in your API project.
Set up a Client Secret or a Certificate in the Azure App Registration. Include that in your appsettings.json file:
"AzureAd": {
"Instance": "https://login.microsoftonline.com/",
"Domain": "{YOUR-DOMAIN-NAME-FROM-APP-REGISTRATION}",
"TenantId": "{YOUR-TENANT-ID-FROM-APP-REGISTRATION}",
"ClientId": "{YOUR-CLIENT-ID-FROM-APP-REGISTRATION}",
"Scopes": "{YOUR-API-ACCESS-SCOPE-FROM-APP-REGISTRATION}",
"CallbackPath": "/signin-oidc",
"ClientSecret": "{YOUR-CLIENT-SECRET-FROM-APP-REGISTRATION}"
}
Include the following section in your appsettings.json file:
"Graph": {
"BaseUrl": "https://graph.microsoft.com/v1.0",
"Scopes": "User.Read"
}
Include the following code in your Project.cs file or Startup.cs file (depending on what version of .Net you're using):
Startup.cs:
services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme)
.AddMicrosoftIdentityWebApi(Configuration, Configuration.GetSection("AzureAd"))
.EnableTokenAcquisitionToCallDownstreamApi()
.AddMicrosoftGraph(Configuration.GetSection("Graph"))
.AddInMemoryTokenCaches();
Project.cs:
builder.Services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme)
.AddMicrosoftIdentityWebApi(builder.Configuration.GetSection("AzureAd"))
.EnableTokenAcquisitionToCallDownstreamApi()
.AddMicrosoftGraph(builder.Configuration.GetSection("Graph"))
.AddInMemoryTokenCaches();
From there, you just need to inject the GraphServiceClient into your controller or page constructor. The link above provides code for implementation in an ASP.NET API. I'm using this method in a Blazor Webassembly hosted app, so my implementation needs varied slightly from the instructions, but it's running/working as it should.

Azure AD Login issue only happening when running app on IIS Server

I've got a small Blazor app that uses AzureAD for user authentication. When I run the app directly from visual studio, I am able to login without any issues, however when I deploy the app to IIS, I get the below error when I click 'Login'.
IOException: IDX20807: Unable to retrieve document from: 'System.String'. HttpResponseMessage:
'System.Net.Http.HttpResponseMessage', HttpResponseMessage.Content: 'System.String'.
Microsoft.IdentityModel.Protocols.HttpDocumentRetriever.GetDocumentAsync(string address,
CancellationToken cancel)
InvalidOperationException: IDX20803: Unable to obtain configuration from: 'System.String'.
Microsoft.IdentityModel.Protocols.ConfigurationManager<T>.GetConfigurationAsync(CancellationToken cancel)
My appsettings.json configuration is:
AzureAd": {
"Instance": "https://login.microsoftonline.com/",
"Domain": "qualified.domain.name",
"TenantId": "22222222-2222-2222-2222-222222222222",
"ClientId": "11111111-1111-1111-11111111111111111",
"CallbackPath": "/signin-oidc",
"ClientSecret": "NNNNNNN-~nnnnnnnn_NNNNNNNNNNN~nnnn"
},
With the Domain, TenantId, ClientId and ClientSecret being populated from the secrets.json file.
My ConfigureServices function in the Startup.cs is:
public void ConfigureServices(IServiceCollection services)
{
services.AddAuthentication(OpenIdConnectDefaults.AuthenticationScheme)
.AddMicrosoftIdentityWebApp(Configuration.GetSection("AzureAd"))
.EnableTokenAcquisitionToCallDownstreamApi(options =>
{
Configuration.Bind("AzureAd", options);
}, GraphConstants.Scopes)
.AddInMemoryTokenCaches();
services.AddControllersWithViews()
.AddMicrosoftIdentityUI();
services.AddRazorPages();
services.AddServerSideBlazor()
.AddMicrosoftIdentityConsentHandler();
services.AddMudServices();
}
And the code for the Login button is:
<AuthorizeView>
<Authorized>
Hello, #context.User.Identity.Name!
Log out
</Authorized>
<NotAuthorized>
Log in
</NotAuthorized>
</AuthorizeView>
My IIS configuration was done following the steps in this tutorial - https://www.c-sharpcorner.com/article/deploying-a-blazor-application-on-iis/
I've tried playing around with different settings around the AddMicrosoftIdentityWebApp section, figuring it was something to do with the configuration there, but nothing I try seems to make any difference.
Any help would be appreciated,
Thanks
Turns out the issue was to do with me using secrets.json to store some of the configuration.
This thread - ASP.NET Core 2 web application isn't loading user secrets when debugging IIS website - helped me figure out the solution

Customising Azure B2C Login UI

I've created a simple template like in the demos:
<!DOCTYPE html>
<html>
<head>
<title>Add your title here</title>
</head>
<body>
<h1>My B2C Application</h1>
<div id="api"></div> <!-- Leave this element empty because Azure AD B2C will insert content here. -->
</body>
</html>
This is a file hosted on my App Service at:
https://<mydomain>.azurewebsites.net/html.signin.html
I've created a B2C tennent and that is all working. In my Signup Signin policy (B2C_1_aa-signup-signin)
I've setup the custom page url to:
https://<mydomain>.azurewebsites.net/html.signin.html
However, even just clicking on the Signup button on my site returns an error:
Error. An error occurred while processing your request.
Request ID: |258cfa9e-4dab035257ed702a. Development Mode
Swapping to Development environment will display more detailed
information about the error that occurred.
Development environment should not be enabled in deployed
applications, as it can result in sensitive information from
exceptions being displayed to end users. For local debugging,
development environment can be enabled by setting the
ASPNETCORE_ENVIRONMENT environment variable to Development, and
restarting the application.
I've setup CORS in my .NET Core 2.1 application with:
services.AddCors();
And:
app.UseCors(opt =>
{
opt.WithOrigins("https://<b2c-tennent-name>.b2clogin.com")
.AllowAnyHeader()
.AllowAnyMethod();
});
From all I've read, this is all I should have to do. I've been looking to try and find any CORS settings on my web sites App Service but I can't see anything relevant.
My site config is:
"AzureAdB2C": {
"Instance": "https://<b2c-tennent-name>.b2clogin.com/tfp/",
"ClientId": "<my id>",
"CallbackPath": "/signin-oidc",
"Domain": "<b2c-tennent-name>.onmicrosoft.com",
"SignUpSignInPolicyId": "B2C_1_aa-signup-signin",
"ResetPasswordPolicyId": "B2C_1_aa-password-reset",
"EditProfilePolicyId": "B2C_1_aa-profile-edit"
},
I've also enabled App Insights on my web app but I can't even seem to get a handle on an error message to solve.
I guess I have two questions.
What should I check configuration wise next?
And how do I find out what the error is? Azure seems completely opaque on this topic. I've no idea of the error at all.
Until I get identify the problem I'm completely shooting in the dark. As far as I can tell the only way I have deviated from the docs is that my html file is hosted on my App Service which from this document is a completely legitimate place to host it.
This write up describes exactly what I've done yet I my login is completely broken.
After digging around the requests I've found this hidden in an OK 200 response:
AADB2C90006: The redirect URI 'http://<my-app-service>.azurewebsites.net/signin-oidc' provided in the request is not registered for the client id 'b850cee0-f723-47fd-8f2e-c1fa1ec21038'.
But you can only register https reply URLs so how do I fix this?
Register your reply url with HTTPS: https://<my-app-service>.azurewebsites.net/signin-oidc. Azure app services hosted under the azurewebsites.net domain provide a built-in SSL certificate.

AzureAD authentication only works on local

Ive set up my AzureAD in the portal, and an appservice that uses the AD to authenticate following instructions from microsoft.
Ive made a .net core app that uses this authorisation. It works on my localhost. But when i publish it i get this error
AADSTS50011: The reply url specified in the request does not match the reply urls configured for the application: '614f66a9-xxxx-483a-8bc7-xxxxxxx'
What should i change and how come it works in my local but not when published?
This is current configuration of app:
{
"AzureAd": {
"Instance": "https://login.microsoftonline.com/",
"Domain": "lmyName.onmicrosoft.com",
"TenantId": "******-ebd5-40d8-829b-*********",
"ClientId": "*****-8eef-483a-8bc7-********",
"CallbackPath": "/signin-oidc"
},
"Logging": {
"IncludeScopes": false,
"LogLevel": {
"Default": "Warning"
}
}
}
When i followed the online intructions i was directed to configure the appservice in the portal to use reply URL: /.auth/login/aad/callback
Could that be the same as callbackPath?
For your case, you can change your reply URL in AAD Application to be <YourApplicaitonURL>/signin-oidc.
NOTE The base address in the Sign-on URL and Logout URL settings is http://localhost:port.
This localhost address allows the sample app to run insecurely from your local system. Port is the default port for the Kestrel server. Update the reply URL in your AAD Application if you configure the app for production use(If you publish your App to Azure Web App service).
For example, https://yourapp.azurewebsites.net/signin-oidc or https://www.contoso.com/signout-oidc
You can also refer to this Sample to Integrate Azure AD into an ASP.NET Core web app.
Please let me know if it helps!

Resources