如何解决Blazor WASM登录成功后跳转指定页面触发二次加载的问题

解决方案 #

方案1（推荐，无重复加载问题） #

你第一次尝试的方案未生效，是因为你将当前访问的URI作为了returnUrl参数，若要固定所有登录成功场景都跳转到/Holidays，直接将returnUrl写为指定路径即可：

protected override void OnInitialized()
{
    Navigation.NavigateTo($"authentication/login?returnUrl={Uri.EscapeDataString("/Holidays")}");
}

该方案是Blazor WASM认证体系的标准实现，逻辑简洁，不会出现重复跳转问题。

方案2（适配需要自定义登录后逻辑的场景） #

如果你有特殊需求必须通过RemoteAuthenticatorView的OnLogInSucceeded事件实现跳转，出现两次触发的原因是该组件处理登录回调时会经历多轮状态变更，每轮符合条件的渲染都会触发该事件，可以加一个执行标志位避免重复执行：

@page "/authentication/{action}"
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication
@inject NavigationManager Navigation

<RemoteAuthenticatorView Action="@Action" OnLogInSucceeded="@RedirectToHolidayViewer" />

@code{
    [Parameter] public string Action { get; set; }
    // 防重复执行标志
    private bool _hasRedirected = false;

    private void RedirectToHolidayViewer()
    {
        if (_hasRedirected) return;
        _hasRedirected = true;
        Navigation.NavigateTo("/Holidays");
    }
}

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