I need to get msal authentication working with EntraID. I have a net 6 wasm application and I am getting daft errors - I must have looked at my appsettings.json file 100 times for a typo.
I am getting the error :
Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100]Unhandled exception rendering component: Failed to construct 'URL': Invalid URLTypeError: Failed to construct 'URL': Invalid URLat new u (https://localhost:7151/_content/Microsoft.Authentication.WebAssembly.Msal/AuthenticationService.js:2:191011)at l.init (https://localhost:7151/_content/Microsoft.Authentication.WebAssembly.Msal/AuthenticationService.js:2:196273)
My web app to get the msal working as very very basic indeed, nothing special here.Appsettings.json file
Index.html
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /><title>AuthWebApp</title><base href="/" /><link href="css/bootstrap/bootstrap.min.css" rel="stylesheet" /><link href="css/app.css" rel="stylesheet" /><link href="AuthWebApp.styles.css" rel="stylesheet" /></head><body><div id="app">Loading...</div><div id="blazor-error-ui"> An unhandled error has occurred.<a href="" class="reload">Reload</a><a class="dismiss">🗙</a></div><script src="_framework/blazor.webassembly.js"></script><script src="_content/Microsoft.Authentication.WebAssembly.Msal/AuthenticationService.js"></script></body></html>Program.cs
using AuthWebApp;using Microsoft.AspNetCore.Components.Web;using Microsoft.AspNetCore.Components.WebAssembly.Hosting;var builder = WebAssemblyHostBuilder.CreateDefault(args);builder.RootComponents.Add<App>("#app");builder.RootComponents.Add<HeadOutlet>("head::after");builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });builder.Services.AddMsalAuthentication(options =>{ builder.Configuration.Bind("AzureAd", options.ProviderOptions.Authentication); options.ProviderOptions.LoginMode = "redirect";});await builder.Build().RunAsync();index.razor
@page "/"<PageTitle>Index</PageTitle>@attribute [Authorize]<h1>User needs to be in AD for this page to work</h1>Authentication.razor
@page "/Authentication/{action}"@using Microsoft.AspNetCore.Components.WebAssembly.Authentication<RemoteAuthenticatorView Action="@action"></RemoteAuthenticatorView>@code { [Parameter] public string ?action { get; set; }}I cannot seem to get over this error and the logging is pretty useless on the browser. The app registration is just a basic one with the redirect set to:
https://localhost:7151/Authentication/login-callback