Blazor WASM使用Auth0+自定义路由视图后登录链接失效求助

你的CustomRouteView在未认证状态下完全忽略了当前RouteData指向的页面，不管用户访问哪个路由，都强制渲染<Public />组件。当点击登录按钮导航到/authentication/login时，本该加载Authentication组件，但被Public组件覆盖，导致页面无响应且断点不触发。

修改CustomRouteView的NotAuthorized逻辑，判断当前路由是否为认证相关页面（比如Authentication组件），如果是则渲染对应页面，否则显示Public组件：

@using Microsoft.AspNetCore.Components.Rendering

<AuthorizeView>
    <Authorized>
        <LayoutView Layout="typeof(MainLayout)" ChildContent="(RenderFragment)RenderPageWithParameters" />
    </Authorized>
    <NotAuthorized>
        <LayoutView Layout="typeof(PublicLayout)">
            @{
                var pageType = RouteData.PageType;
                // 判断是否是Authentication组件（可根据实际类型调整判断条件）
                if (pageType.Name.Equals("Authentication", StringComparison.OrdinalIgnoreCase))
                {
                    RenderPageWithParameters(builder => builder);
                }
                else
                {
                    <Public />
                }
            }
        </LayoutView>
    </NotAuthorized>
</AuthorizeView>

@code {
    [Parameter] public RouteData RouteData { get; set; }

    private void RenderPageWithParameters(RenderTreeBuilder builder)
    {
        builder.OpenComponent(0, RouteData.PageType);
        foreach (var kvp in RouteData.RouteValues)
        {
            builder.AddAttribute(1, kvp.Key, kvp.Value);
        }
        builder.CloseComponent();
    }
}

无需自定义RouteView，直接在App.razor中结合AuthorizeView和RouteView实现布局切换，更易维护：

<CascadingAuthenticationState>
    <Router AppAssembly="@typeof(App).Assembly">
        <Found Context="routeData">
            <AuthorizeView RouteData="@routeData">
                <Authorized>
                    <LayoutView Layout="typeof(MainLayout)">
                        <RouteView RouteData="@routeData" />
                    </LayoutView>
                </Authorized>
                <NotAuthorized>
                    @{
                        // 判断是否为认证路由
                        var isAuthRoute = routeData.PageType.Name.Equals("Authentication", StringComparison.OrdinalIgnoreCase);
                        if (isAuthRoute)
                        {
                            <LayoutView Layout="typeof(PublicLayout)">
                                <RouteView RouteData="@routeData" />
                            </LayoutView>
                        }
                        else
                        {
                            <LayoutView Layout="typeof(PublicLayout)">
                                <Public />
                            </LayoutView>
                        }
                    }
                </NotAuthorized>
            </AuthorizeView>
            <FocusOnNavigate RouteData="@routeData" Selector="h1" />
        </Found>
        <NotFound>
            <PageTitle>Not found</PageTitle>
            <LayoutView Layout="@typeof(MainLayout)">
                <p role="alert">Sorry, there's nothing at this address.</p>
            </LayoutView>
        </NotFound>
    </Router>
</CascadingAuthenticationState>

这个方案直接使用Blazor内置的RouteView处理页面渲染，避免手动构建RenderTree的潜在问题。

1. 确认Authentication组件的路由配置正确：@page "/authentication/{action}"
2. 确认Auth0的OIDC配置在Program.cs中正确注册，包含必要的Authority、ClientId等参数

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