如何在Blazor项目中添加Razor页面？遇404错误求解决

遗漏的关键步骤 #

你已经完成了Razor Pages服务注册（builder.Services.AddRazorPages()），但还缺少以下核心操作：

1. 在中间件管道中映射Razor Pages路由
   ASP.NET Core的服务注册和路由映射是两个独立步骤，仅注册服务不会让框架处理Razor Pages的请求。必须在Program.cs的中间件配置中添加app.MapRazorPages()，且注意顺序要早于Blazor相关的路由映射，避免请求被Blazor的 fallback 路由拦截：

   var app = builder.Build();
   
   // 其他中间件（如静态文件、认证）
   app.UseStaticFiles();
   app.UseRouting();
   
   // 先映射Razor Pages路由
   app.MapRazorPages();
   
   // 再配置Blazor相关路由
   app.MapBlazorHub();
   app.MapFallbackToPage("/_Host"); // 或针对WASM的MapFallbackToFile("/index.html")
   

2. 确认Razor页面的基础配置无误

   • 确保Razor页面文件（.cshtml）放在Pages目录下（若自定义目录，需通过AddRazorPagesOptions配置根目录）；
   • 检查@page "/testing"指令无拼写错误，访问URL与路由模板完全匹配（默认路由不区分大小写，但建议保持一致）；
   • 若页面有代码后置文件（.cshtml.cs），确认其命名空间和类继承（需继承PageModel）正确。

ASP.NET Core路由系统排查方法 #

1. 启用路由调试日志 #

在appsettings.json中添加路由日志配置，控制台会输出请求匹配的详细过程，帮你定位路由未命中的原因：

"Logging": {
  "LogLevel": {
    "Microsoft.AspNetCore.Routing": "Debug"
  }
}

2. 打印所有注册的路由端点 #

在Program.cs中添加代码，启动时输出所有已注册的路由，确认你的Razor页面路由是否被正确注册：

app.UseEndpoints(endpoints =>
{
    endpoints.MapRazorPages();
    endpoints.MapBlazorHub();
    endpoints.MapFallbackToPage("/_Host");

    // 输出所有端点信息
    foreach (var endpoint in endpoints.DataSources.SelectMany(ds => ds.Endpoints))
    {
        if (endpoint is RouteEndpoint routeEndpoint)
        {
            Console.WriteLine($"已注册路由: {routeEndpoint.RoutePattern.RawText} | 类型: {endpoint.DisplayName}");
        }
    }
});

3. 检查中间件顺序 #

ASP.NET Core中间件按注册顺序处理请求，若MapFallbackToPage或MapFallbackToFile在MapRazorPages之前，会导致所有未匹配的请求被Blazor fallback 路由拦截，Razor页面的请求永远不会被处理。

4. 排除缓存与编译问题 #

• 清理项目的bin和obj目录，重新生成解决方案；
• 重启开发服务器，避免旧的路由配置被缓存。

5. 验证路由约束与权限 #

若页面添加了[Route]属性约束或[Authorize]授权属性，需确认请求满足约束条件（如参数格式、用户权限），这类问题可能伪装成404错误。

你的猜测完全正确：Blazor项目默认仅配置Blazor组件的路由系统，不会自动处理Razor Pages请求，必须手动完成服务注册和路由映射两个步骤。

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