如何拦截Blazor WASM的MSAL.JS调用以添加ui_locales参数？

一、传递ui_locales参数到Entra ID（规避手动重定向错误） #

手动构造授权URL重定向会破坏MSAL的状态跟踪逻辑，直接导致"Source not found"错误，正确做法是通过库提供的规范方式传递参数：

• 静态配置固定语言：在AddMsalAuthentication的初始化配置中，直接添加额外查询参数：

  builder.Services.AddMsalAuthentication(options =>
  {
      // 原有配置
      options.ProviderOptions.DefaultAccessTokenScopes.Add("api://xxxxxx-xxxx-xxxx-xxxx-xxxxxxxxx/access_as_user");
      builder.Configuration.Bind("EntraExternalId", options.ProviderOptions.Authentication);
      options.UserOptions.NameClaim = "name";
      options.UserOptions.RoleClaim = "roles";
      options.ProviderOptions.Cache.CacheLocation = "localStorage";
  
      // 追加ui_locales参数，示例为中文环境
      options.ProviderOptions.AdditionalQueryParameters.Add("ui_locales", "zh-CN");
  });
  

• 动态适配当前应用文化：如果需要根据用户当前使用的文化动态设置，可在触发登录时通过NavigationManager传递参数到内置认证页面：

  @inject NavigationManager NavManager
  
  <button @onclick="TriggerLocalizedLogin">登录</button>
  
  @code {
      private void TriggerLocalizedLogin()
      {
          var currentCulture = System.Globalization.CultureInfo.CurrentCulture.Name;
          // 导航到内置认证登录页并附加ui_locales参数
          NavManager.NavigateTo($"authentication/login?ui_locales={currentCulture}", forceLoad: true);
      }
  }
  

  内置的authentication/@action页面会自动将该参数传递给MSAL.js，最终在向Entra ID发起授权请求时带上ui_locales查询参数，实现登录界面的本地化。

二、Blazor WASM从authentication/@action页面获取令牌的机制 #

这个内置页面是Microsoft.AspNetCore.Components.WebAssembly.Authentication库封装的认证处理入口，核心流程如下：

1. 当应用触发登录（或自动重定向认证）时，会跳转至authentication/login页面，该页面加载MSAL.js并初始化OAuth2/OIDC认证请求。
2. MSAL.js完成与Entra ID的交互流程后，会将获取到的ID Token、Access Token等令牌存储到你配置的localStorage（或sessionStorage）中。
3. Blazor应用内的MsalAuthenticationStateProvider会监听存储中的令牌变化，或在应用初始化时读取存储内的令牌信息，生成AuthenticationState供整个应用的认证组件使用。
4. 整个流程是封装好的，但你可以通过AddMsalAuthentication的配置项（如缓存位置、声明映射、额外请求参数等）定制行为，也可以通过继承MsalAuthenticationStateProvider扩展自定义认证逻辑。

内容的提问来源于stack exchange，提问作者Naish O'Loughlin