Authentication 使用多个身份提供程序对Blazor WebAssembly进行身份验证

我正在学习Blazor WebAssembly并构建一个小项目，作为Azure中的静态Web应用程序托管

目标框架是net5.0

当用户单击“登录”超链接或按钮时，一个新页面将显示一些身份提供商的名称（Microsoft、Google、SackOverflow等）。然后用户将选择一个进行登录

我只使用了一个身份提供者（微软、谷歌等）

如何在同一应用程序中使用多个身份提供商

有人能帮我吗

Blazor WebAssembly应用程序

TargetFramework:net5.0

在Azure中作为静态Web应用程序托管

Program.cs

using Blazored.LocalStorage;

using Microsoft.AspNetCore.Components.WebAssembly.Hosting;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.DependencyInjection;

using System;
using System.Net.Http;
using System.Threading.Tasks;

namespace FileProcApp
{
    public class Program
    {
        public static async Task Main(string[] args) {
            var builder = WebAssemblyHostBuilder.CreateDefault(args);
            builder.RootComponents.Add<App>("#app");

            builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });

            builder.Services.AddOidcAuthentication(options => {
                options.ProviderOptions.DefaultScopes.Clear();
                options.ProviderOptions.DefaultScopes.Add("openid");
                options.ProviderOptions.DefaultScopes.Add("offline_access");
                builder.Configuration.Bind("AzureAd", options.ProviderOptions);
            });
            
            builder.Services.AddOidcAuthentication(options => {
                options.ProviderOptions.DefaultScopes.Clear();               
                builder.Configuration.Bind("Google", options.ProviderOptions);
            });


            builder.Services.AddBlazoredLocalStorage();

            builder.Services.AddSingleton<Services.Authentication>();

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

LoginDisplay.razor

@using Microsoft.AspNetCore.Components.Authorization
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication

@using Microsoft.Extensions.Logging
@using System.Text.Json

@inject NavigationManager Navigation
@inject SignOutSessionStateManager SignOutManager

@inject Services.Authentication UserAuthentication

@inject Blazored.LocalStorage.ILocalStorageService localStorage

<AuthorizeView>
    <Authorized>
        Hello, @context.User.Identity.Name!

        <img src="img/UsrTeste.jpg" style="width:28px; cursor:pointer; " />
        <span style="cursor:pointer; ">usuario.teste@teste.com.br</span>

        <div>
            @System.Text.Json.JsonSerializer.Serialize(context.User.Identity, new JsonSerializerOptions() { WriteIndented = true });
            @RegistraAutenticacao();
        </div>
        <button class="nav-link btn btn-link" @onclick="BeginSignOut">Log out</button>
    </Authorized>
    <NotAuthorized>
        <a class="sign-in" href="authentication/register">Register</a>
        <a href="authentication/login">Log in</a>
    </NotAuthorized>
    <Authorizing>
        <span>Autorizando</span>
    </Authorizing>
</AuthorizeView>


@code{
    private async Task BeginSignOut(MouseEventArgs args)
    {
        await SignOutManager.SetSignOutState();
        Navigation.NavigateTo("authentication/logout");
    }
    private async Task RegistraAutenticacao() {
        await UserAuthentication.RegistraAutenticacao();
    }
}

@使用Microsoft.AspNetCore.Components.Authorization
@使用Microsoft.AspNetCore.Components.WebAssembly.Authentication
@使用Microsoft.Extensions.Logging
@使用System.Text.Json
@注入导航管理器导航
@注入SignOutSessionStateManager SignOutManager
@注入服务。身份验证用户身份验证
@注入Blazored.LocalStorage.ILocalStorageService LocalStorage
Autorizando
@代码{
专用异步任务BeginSignOut（MouseEventArgs args）
{
等待SignOutManager.SetSignOutState（）；
导航。导航到（“身份验证/注销”）；
}
专用异步任务注册器autenticacao（）{
等待UserAuthentication.Registrautenticao（）；
}
}

@using Microsoft.AspNetCore.Components.Authorization
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication

@using Microsoft.Extensions.Logging
@using System.Text.Json

@inject NavigationManager Navigation
@inject SignOutSessionStateManager SignOutManager

@inject Services.Authentication UserAuthentication

@inject Blazored.LocalStorage.ILocalStorageService localStorage

<AuthorizeView>
    <Authorized>
        Hello, @context.User.Identity.Name!

        <img src="img/UsrTeste.jpg" style="width:28px; cursor:pointer; " />
        <span style="cursor:pointer; ">usuario.teste@teste.com.br</span>

        <div>
            @System.Text.Json.JsonSerializer.Serialize(context.User.Identity, new JsonSerializerOptions() { WriteIndented = true });
            @RegistraAutenticacao();
        </div>
        <button class="nav-link btn btn-link" @onclick="BeginSignOut">Log out</button>
    </Authorized>
    <NotAuthorized>
        <a class="sign-in" href="authentication/register">Register</a>
        <a href="authentication/login">Log in</a>
    </NotAuthorized>
    <Authorizing>
        <span>Autorizando</span>
    </Authorizing>
</AuthorizeView>


@code{
    private async Task BeginSignOut(MouseEventArgs args)
    {
        await SignOutManager.SetSignOutState();
        Navigation.NavigateTo("authentication/logout");
    }
    private async Task RegistraAutenticacao() {
        await UserAuthentication.RegistraAutenticacao();
    }
}