Blazor WASM调用启用Windows身份验证的Web API报401如何解决

方案1：直接跨域调用配置（适合不想新增代理的场景） #

• 第一步：修改服务器A上app A的CORS配置
  当前配置的通配符*不支持携带凭据的跨域请求，必须明确指定允许的源，同时开启允许凭据。修改app A的web.config配置如下：

<httpProtocol>
  <customHeaders>
    <clear />
    <!-- 替换为Blazor WASM应用的完整访问地址，例如https://server-b.domain.com:8080 -->
    <add name="Access-Control-Allow-Origin" value="https://<Blazor服务器B的完整域名+端口>" />
    <add name="Access-Control-Allow-Credentials" value="true" />
    <!-- 按需添加允许的请求方法和头，适配OPTIONS预检请求 -->
    <add name="Access-Control-Allow-Methods" value="GET,POST,PUT,DELETE,OPTIONS" />
    <add name="Access-Control-Allow-Headers" value="Content-Type,Authorization" />
  </customHeaders>
</httpProtocol>

注意：如果服务器A的IIS已经安装了CORS模块并配置了规则，不要同时用customHeaders配置，避免重复冲突，优先通过CORS模块配置上述规则。

• 第二步：配置Blazor WASM的HttpClient自动携带凭据
  Blazor WASM基于浏览器fetch API发起请求，可通过扩展方法指定请求携带认证凭据，两种配置方式选其一即可：

  • 全局配置：在Program.cs中注册HttpClient时统一配置，所有请求自动携带凭据

    // 需引用命名空间 Microsoft.AspNetCore.Components.WebAssembly.Http
    builder.Services.AddHttpClient("AppAClient", client =>
    {
        client.BaseAddress = new Uri("https://<服务器A的app A访问地址>/");
    }).AddHttpMessageHandler(() => new DelegatingHandler
    {
        InnerHandler = new HttpClientHandler()
    });
    
    // 发送请求时调用自定义扩展方法自动附加凭据配置
    public static class HttpClientExtension
    {
        public static async Task<HttpResponseMessage> SendWithCredentialsAsync(this HttpClient client, HttpRequestMessage request, CancellationToken cancellationToken = default)
        {
            request.SetBrowserRequestCredentials(BrowserRequestCredentials.Include);
            return await client.SendAsync(request, cancellationToken);
        }
    }
    

  • 单请求配置：调用接口时单独给请求添加凭据标记

    var request = new HttpRequestMessage(HttpMethod.Get, "api/your-interface");
    request.SetBrowserRequestCredentials(BrowserRequestCredentials.Include);
    var response = await _httpClient.SendAsync(request);
    

• 第三步：校验IIS认证配置

  • 服务器A的app A关闭匿名认证，开启Windows认证，认证提供程序保留Negotiate和NTLM即可
  • 确保两台服务器都加入同一个Active Directory域，访问Blazor的域用户同时具备app A的访问权限

方案2：反向代理方案（更稳定无跨域问题，推荐） #

无需修改CORS配置，直接在服务器B的IIS上为Blazor应用配置反向代理，把app A的接口路径转发到服务器A，从浏览器视角看所有请求都是同源，天然携带Windows认证凭据：

• 第一步：服务器B的IIS安装ARR模块和反向代理功能，在Blazor应用的web.config中添加重写规则：

<system.webServer>
  <rewrite>
    <rules>
      <rule name="ProxyToAppA" stopProcessing="true">
        <match url="^api/appA/(.*)" />
        <action type="Rewrite" url="https://<服务器A的app A访问地址>/{R:1}" />
        <serverVariables>
          <!-- 转发认证头到app A -->
          <set name="HTTP_AUTHORIZATION" value="{HTTP_AUTHORIZATION}" />
        </serverVariables>
      </rule>
    </rules>
  </rewrite>
</system.webServer>

• 第二步：Blazor WASM直接调用同源代理路径即可，例如请求/api/appA/xxx，无需额外配置HttpClient的凭据参数，浏览器会自动携带当前站点的认证头。

验证步骤 #

配置完成后清除浏览器缓存，用域用户登录Blazor应用后调用接口，检查请求头是否携带Authorization: Negotiate/NTLM xxx字段，返回状态码为200即配置成功。

内容的提问来源于stack exchange，提问作者sss