Blazor WASM 停留在 "Authorizing..." 和 "Completing login..."

Blazor WASM stuck on "Authorizing..." and "Completing login..."

升级到 .Net 5.0 后,我的 blazor WASM 应用程序开始卡在“正在授权...”(当用户已经登录时卡住,第一次加载重定向到登录屏幕工作正常,所以我有清除缓存,如果我想让它工作)和“完成登录...”(使用 URL 像 https://localhost:5001/authentication/login-callback?code=51FEF78805049242F1092A249B1746393790AE956B1FC2136092AE0924B3FB42&scope=openid% 20profile%20email%20MyApp.WebAPI&state=e8bffbd2b93f44dc8a261cf6d65c6165&session_state=eE0yRtJI0fkjptvZSIfiUsvuHAQoyNStmS_kv--Wcv0.DCACB551F4CC63841C2615456DD4B9BF) - 如果我在卡在“完成登录...”后转到 localhost:5001 我是终于登录了。

最初它在大多数现代计算机上运行良好,并且该问题仅在速度较慢的计算机(例如约 8 岁的笔记本电脑)上可见。然而,虽然我试图了解问题并解决它,但我也设法在我的开发人员笔记本电脑上完全阻止它,主要分支仍然可以正常工作。

创建一个新的 ASP.Net 核心应用程序并使用 IdentityServer4 进行身份验证工作正常,没有问题。

我的问题看起来类似于 https://github.com/dotnet/aspnetcore/issues/26195 - 但是,我只使用 IdentityServer4,并且在开发者控制台中没有看到任何异常。

我试图将代码减少到最低限度,所以这里是 Program.cs:

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

    builder.Services.AddApiAuthorization();

    builder.Services.AddSingleton<IStringLocalizer>(serviceProvider =>
    {
        var factory = serviceProvider.GetRequiredService<IStringLocalizerFactory>();
        return factory.Create(typeof(SharedResource));
    });
    builder.Services.AddLocalization();

    builder.Services
        .AddBlazorise()
        .AddBootstrapProviders();

    builder.Logging.SetMinimumLevel(LogLevel.Trace);

    var host = builder.Build();

    host.Services.UseBootstrapProviders();

    await host.RunAsync();
}

App.razor:

@inject IStringLocalizer S

<ThemeManager>
    <CascadingAuthenticationState>
        <Router AppAssembly="@typeof(App).Assembly" PreferExactMatches="@true">
            <Found Context="routeData">
                <AuthorizeRouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)">
                    <NotAuthorized>
                        @if (context.User.Identity?.IsAuthenticated ?? false)
                        {
                            <p>@S["You don't have enough permissions to access this page."]</p>
                        }
                        else
                        {
                            <RedirectToLogin />
                        }
                    </NotAuthorized>
                </AuthorizeRouteView>
            </Found>
            <NotFound>
                <LayoutView Layout="@typeof(MainLayout)">
                    <NotFoundError>
                    </NotFoundError>
                </LayoutView>
            </NotFound>
        </Router>
    </CascadingAuthenticationState>
</ThemeManager>

MainLayout.razor:

@inherits Microsoft.AspNetCore.Components.LayoutComponentBase

<header>
</header>

<main>
    @Body
</main>

Authentication.razor:

@page "/authentication/{action}"
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication
<RemoteAuthenticatorView Action="@Action" />

@if (Action == "logged-out")
{
    <RedirectToLogin RedirectBackToRoot="true"></RedirectToLogin>
}

@code{
    [Parameter]
    public string? Action { get; set; }
}

问题是,它卡住了,我什至看不出哪里出了问题。我这里的一个依赖项是 https://github.com/stsrki/Blazorise - 但是,我也向新应用程序添加了相同的依赖项,并且仍然有效。

知道如何识别问题吗?

答案是,对 JS 库的引用 pace.js 破坏了身份验证。新版本的库大约在同一时间发布(并自动更新),我们升级到 .Net 5.0,所以不确定是 .Net 5 问题还是库问题。