.NET 5 Blazor wasm Standalone 与身份验证库注销问题

Question

正如 Microsoft 文档所述，我已遵循通过 Google 进行身份验证的安全设置。

我可以登录，但在尝试注销时不断收到错误消息：

我的 URL 被重定向到：

https://localhost:5001/authentication/logout-failed?message=The%20logout%20was%20not%20initiated%20from%20within%20the%20page。

我收到以下错误：

尝试注销您时出错：''

我的注销代码非常基本：

退出按钮和导航：

<AuthorizeView>
            <Authorized>
                <button class="nav-link" @onclick="(e) => SignOut(e)">
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="24px" height="24px"><path d="M0 0h24v24H0z" fill="none" /><path d="M17 7l-1.41 1.41L18.17 11H8v2h10.17l-2.58 2.58L17 17l5-5zM4 5h8V3H4c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h8v-2H4V5z" /></svg>
                </button>
            </Authorized>
        </AuthorizeView>

private async Task SignOut(MouseEventArgs args)
    {
        await SignOutManager.SetSignOutState();
        NavManager.NavigateTo("/authentication/logout", true);
    }

认证页面

@page "/authentication/{action}"

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

如果我理解正确，这应该足以注销。

我做错了什么？

感谢您的宝贵时间。

编辑

我的 AppSettings 配置为：

"Authentication": {
    "Google": {
      "Authority": "https://accounts.google.com/",
      "ClientId": "XXXXXXXXXXXXXXXXXXXXXXXXXX.apps.googleusercontent.com",
      "ClientSecret": "XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",
      "PostLogoutRedirectUri": "https://localhost:5001/authentication/logout-callback",
      "RedirectUri": "https://localhost:5001/authentication/login-callback",
      "ResponseType": "id_token",
    }
}

我的 program.cs 文件将其称为：

builder.Services.AddOidcAuthentication(options =>
            {
                builder.Configuration.Bind("Authentication:Google", options.ProviderOptions);
            });

我已经修改了我的代码：

NavManager.NavigateTo("/authentication/logout", true);

到

Navigation.NavigateTo("authentication/logout");

这并没有改变任何东西。 但您仍然必须这样使用它。

我的控制台日志正在打印以下信息消息：

信息： Microsoft.AspNetCore.Authorization.DefaultAuthorizationService[2] 授权失败。未满足这些要求： DenyAnonymousAuthorizationRequirement：需要经过身份验证的用户。

编辑 2

重要的缺失信息

My MainLayout.razor is configured as:

@inherits LayoutComponentBase

@using DoIt.ComponentLibrary.Modal;

<AuthorizeView>
    <Authorized>
        <Modal />
        <NavMenu />
        <main>
            @Body
        </main>
    </Authorized>
    <NotAuthorized>
        <RedirectToLogin></RedirectToLogin>
        @Body
    </NotAuthorized>
</AuthorizeView>

Answer 1

我的 MainLayout.razor 配置为：

@inherits LayoutComponentBase

@using DoIt.ComponentLibrary.Modal;

<AuthorizeView>
    <Authorized>
        <Modal />
        <NavMenu />
        <main>
            @Body
        </main>
    </Authorized>
    <NotAuthorized>
        <RedirectToLogin></RedirectToLogin>
        @Body
    </NotAuthorized>
</AuthorizeView>

在我的 NavMenu 组件下，我配置了上述的注销功能：

    <AuthorizeView>
            <Authorized>
                <button class="nav-link" @onclick="(e) => SignOut(e)">
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="24px" height="24px"><path d="M0 0h24v24H0z" fill="none" /><path d="M17 7l-1.41 1.41L18.17 11H8v2h10.17l-2.58 2.58L17 17l5-5zM4 5h8V3H4c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h8v-2H4V5z" /></svg>
                </button>
            </Authorized>
        </AuthorizeView>

private async Task SignOut(MouseEventArgs args)
    {
        await SignOutManager.SetSignOutState();
        NavManager.NavigateTo("/authentication/logout", true);
    }

这里的问题是：

1. 我按下退出键
2. 页面导航到 /authorization/logout
3. 应用程序注销 -> 在此过程中，由于我不再具有查看此组件的权限，因此将其删除。
4. 注销功能未完全完成，并随着调用组件从 UI 中移除而中断。
5. 出现上述错误

-> 这在我看来是怎么回事。我找不到证实这一点的文档，因为与此流程相关的文档非常有限。

我通过从 AuthorizeView 组件中获取 NavMenu AND Body 组件来解决此问题。

希望对你有帮助。

编辑

真正的解决办法可以在@enet解释的描述中找到

Answer 2

@inherits LayoutComponentBase

@using DoIt.ComponentLibrary.Modal;

<AuthorizeView>
    <Authorized>
        <Modal />
        <NavMenu />
        <main>
            @Body
        </main>
    </Authorized>
    <NotAuthorized>
        <RedirectToLogin></RedirectToLogin>
        @Body
    </NotAuthorized>
</AuthorizeView>

我在您的代码中看到的唯一问题是在 NotAuthorized 委托中使用 @Body。一开始它不应该在那里。问题是，在您注销 NotAuthorized 委托后，执行后，重定向到登录组件，然后渲染系统立即尝试渲染 Index 组件，因为它看到了 @Body 属性，但是很遗憾，您无权查看索引页面...我不知道是什么让你在那里使用它，但你当然应该删除它。至于导航菜单；这没有问题，它应该作为 MainLayout 渲染的一部分保留在那里