如何对 Blazor Web 应用程序和 api 进行身份验证？

Question

我正在为我的服务器使用 .NET 6 RC1 和 Blazor Server，并为我的客户端使用一个单独的 Blazor Webassembly 项目。两者都使用 Azure Ad B2C 进行身份验证。身份验证方面工作正常。

服务器同时托管用于服务器端（管理）页面的 BlazorHub 以及供客户端进行身份验证和调用的独立集线器。

客户端连接到上述集线器，并可能调用任何潜在的 API 端点。

我的认证设置如下

        var builder = WebApplication.CreateBuilder(args);
        var services = builder.Services;
        var configuration = builder.Configuration;

        services.AddAuthentication(OpenIdConnectDefaults.AuthenticationScheme)
            .AddMicrosoftIdentityWebApp(configuration, AzureB2C);

        services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme)
            .AddMicrosoftIdentityWebApi(configuration, AzureB2C);

这里的问题是，如果我定义了这两个，客户端 (localhost:4201) 可以工作并且可以连接到服务器上受保护的集线器。

如果我尝试连接到服务器端点 (localhost:5001)，我只会收到浏览器 401 页面，控制台和 Visual Studio 输出中没有任何内容，除了 crbug/1173575, non-JS module files deprecated. 警告和另外在浏览器控制台中，我收到 Uncaught pause_on_uncaught 错误。

如果我注释掉 AddMicrosoftIdentityWebApp 的部分，客户端仍然可以像以前一样正常连接，并且服务器无法如上所述进行身份验证。

如果我改为注释掉 AddMicrosoftIdentityWebApi 的部分，服务器可以进行身份验证并按预期工作，但现在客户端无法通过集线器进行身份验证，因为未验证 JWT 令牌。

如何成功混合这两种方式，以便我可以在服务器和客户端中进行身份验证？

我在 Microsoft Identity Web github 页面上找到了这个，这基本上是我想要完成的，除了他们提供的代码对我来说并不像我在示例中那样工作。

Answer 1

我似乎已经通过执行以下操作解决了我的问题。

更改我的身份验证方法的顺序。

AddMicrosoftIdentityWebApi第一。

AddMicrosoftIdentityWebApp第二个

为我的 Hub 指定它将使用 JwtBearerDefaults.AuthenticationScheme

app.UseEndpoints(endpoints =>
        {
            endpoints.MapControllers();
            endpoints.MapBlazorHub();
            endpoints.MapHub<GameHub>("/hubs/gamehub")
                .RequireAuthorization(new AuthorizeAttribute
                {
                    AuthenticationSchemes = JwtBearerDefaults.AuthenticationScheme,
                    Policy = PlayerPolicy
                });
            endpoints.MapFallbackToPage("/_Host");
        });

现在都授权就好了！

我很想知道是否有人知道保持原始顺序的解决方案。

如何对 Blazor Web 应用程序和 api 进行身份验证？

How to authenticate both Blazor web app and api?

authentication

authorization

signalr

blazor-server-side

blazor-webassembly