服务端Blazor组件(.razor)跳转Razor Page(.cshtml)被重置如何解决

根因说明 #

该问题由Blazor Server的路由回退机制和SignalR自动重连逻辑共同导致：你配置的Blazor回退路由MapFallbackToPage优先级高于Razor Pages映射，或者Blazor客户端在SignalR连接未断开时会自动修正路由地址，哪怕服务端Razor Page的OnGet已经执行，客户端还是会把地址回弹到之前的Blazor组件路由。

解决方案 #

第一步：修正中间件管道顺序 #

务必在Program.cs中保证Razor Pages映射优先级高于Blazor回退路由，顺序错误是90%以上该类问题的诱因：

var builder = WebApplication.CreateBuilder(args);

// 服务注册顺序无强制要求，但建议Razor Pages在前
builder.Services.AddRazorPages();
builder.Services.AddServerSideBlazor();

// 中间件管道必须严格遵循以下顺序
var app = builder.Build();
app.UseHttpsRedirection();
app.UseStaticFiles();
app.UseRouting();
app.UseAuthorization();

// 1. 先映射Razor Pages
app.MapRazorPages();
// 2. 再映射Blazor Hub
app.MapBlazorHub();
// 3. 最后放置Blazor回退路由
app.MapFallbackToPage("/_Host");

app.Run();

第二步：显式指定Razor Page路由 #

在你的UpdateLandingPage.cshtml顶部添加@page指令，显式指定路由匹配规则，避免默认路由规则不匹配：

@page "/siteupdate"
@model YourNamespace.Pages.SiteUpdate.UpdateLandingPageModel
<!-- 页面其余内容 -->

第三步：跳转前禁用Blazor自动重连 #

Blazor的默认自动重连逻辑会在连接恢复后把路由重置为跳转前的地址，跳转前先通过JS禁用重连逻辑即可彻底避免回弹：

1. 在wwwroot下新增JS文件（或者直接写到_Layout.cshtml里）：

window.BlazorHelpers = {
  ForceRedirect: function (targetPath) {
    // 禁用Blazor自动重连
    if (window.Blazor) {
      Blazor.defaultReconnectionHandler._reconnectCancellationToken?.cancel();
      Blazor.reconnect = () => false;
    }
    // 强制跳转
    window.location.href = targetPath;
  }
};

2. Blazor组件中调用跳转逻辑：

var path = "/siteupdate".AddInitialQueryStringArg("returnUrl", _navManager.Uri);
// 优先用await调用避免异步执行时序问题
await JSRuntime.InvokeVoidAsync("BlazorHelpers.ForceRedirect", path);

验证说明 #

调整后无需再用NavManager.NavigateTo的强制重载参数，走JS跳转可以保证完全脱离Blazor客户端路由控制，不会再出现路由回弹问题。

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