You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Blazor WASM集成Keycloak登录时RemoteAuthenticatorView报错

问题描述

使用VS 2022创建带有独立账户认证的Blazor WASM项目,采用Keycloak作为身份提供商,使用授权码授权流程。初始跳转正常:点击登录会跳转到Keycloak登录页面,输入账号密码后返回Blazor网站,但此时提示**"登录时出错:登录失败"**。为RemoteAuthenticatorView.LogInFailed事件添加处理方法后,断点可正常触发。

通过Wireshark抓包发现token端点返回200 OK且包含有效access token,甚至能使用该token在Postman中正常调用API。对比Duende Identity Provider(在线演示版)的配置,无任何问题,两者token端点返回的内容结构一致,仅信息细节和值有差异。

项目配置代码

public static async Task Main(string[] args)
{
  var builder = WebAssemblyHostBuilder.CreateDefault(args);
  builder.RootComponents.Add<App>("#app");
  builder.RootComponents.Add<HeadOutlet>("head::after");

  builder.RegisterHttpClient();

  builder.Services.AddOidcAuthentication(options =>
  {
    options.ProviderOptions.MetadataUrl = "http://localhost:8080/realms/Test/.well-known/openid-configuration";
    options.ProviderOptions.Authority = "http://localhost:8080/realms/Test";
    options.ProviderOptions.ClientId = "test-client";
    options.ProviderOptions.ResponseType = "code";

    options.UserOptions.NameClaim = "preferred_username";
    options.UserOptions.RoleClaim = "role";
    options.UserOptions.ScopeClaim = "scope";
  });

  await builder.Build().RunAsync();
}

public static class Extensions
{
  public static void RegisterHttpClient(this WebAssemblyHostBuilder builder)
  {
    var httpClientName = "Default";

    builder.Services.AddHttpClient(httpClientName,
        client => client.BaseAddress = new Uri(builder.HostEnvironment.BaseAddress))
        .AddHttpMessageHandler<BaseAddressAuthorizationMessageHandler>();

    builder.Services.AddScoped(sp => sp.GetRequiredService<IHttpClientFactory>()
        .CreateClient(httpClientName));
  }
}
解决方法

问题已解决:Keycloak客户端配置中遗漏了Web Origin条目,导致CORS错误。感谢@jdweng的指引。


内容的提问来源于stack exchange,提问作者Philipp

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.26 01:12:43