Blazor WASM IdentityServer4 注销警报答案

【问题标题】：Blazor WASM IdentityServer4 Logout AlertBlazor WASM IdentityServer4 注销警报
【发布时间】：2021-01-17 20:37:02
【问题描述】：

我在 IdentityServer4 中使用新的独立 Blazor WASM 身份验证流程。我想向用户提供一条消息，说明他们由于不活动而被注销。我已经使用低质量的 js alert() 实现了此功能，但我想知道是否可以使用自定义弹出窗口或发送到 identityserver 的重定向参数以在 identityserver 登录页面上向他们显示警报。

我想不出一种方法来中断 OnLogoutSucceeded 之后发生的立即重定向。 js alert() 暂停重定向并正常工作。我可以修改传出登录重定向 uri 以向 IDS4 提供参数吗？

<RemoteAuthenticatorView Action="@Action" OnLogOutSucceeded="LogoutSucceeded">
</RemoteAuthenticatorView>

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

    private async Task LogoutSucceeded()
    {
        await JsInterop.InvokeVoidAsync("alert", "You have been logged out due to inactivity.");
    }
}

【问题讨论】：

标签： identityserver4 blazor blazor-webassembly

【解决方案1】：

我想通了：

//program.cs
  builder.Services.AddOidcAuthentication<ApplicationAuthenticationState>(options =>
            {
                //options
            });

//Authentication.razor
<RemoteAuthenticatorViewCore Action="@Action"
                             TAuthenticationState="ApplicationAuthenticationState"
                             OnLogOutSucceeded="LogoutSucceeded"
                             AuthenticationState="AuthState" />

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

    public ApplicationAuthenticationState AuthState { get; set; } = new ApplicationAuthenticationState();

    public bool Idled { get; set; }

    protected override void OnInitialized()
    {
        if (RemoteAuthenticationActions.IsAction(RemoteAuthenticationActions.LogOut, Action))
        {
            var uri = NavManager.ToAbsoluteUri(NavManager.Uri);
            if (QueryHelpers.ParseQuery(uri.Query).TryGetValue("idle", out var param))
            {
                AuthState.Idle = !string.IsNullOrWhiteSpace(param);
            }
        }
    }

  private void LogoutSucceeded(ApplicationAuthenticationState state)
    {
        Idled = state.Idle;
        if (Idled)
        {
             // save redirect for later
            var returnUrl = state.ReturnUrl;
            // cancel redirect
            state.ReturnUrl = null;

              // implement custom flow
        }
    }

【讨论】：