找不到页面 - 剃须刀页面项目中的 .razor，Net 5.0答案

【问题标题】：Page can’t be found - .razor in razor pages project, Net 5.0找不到页面 - 剃须刀页面项目中的 .razor，Net 5.0
【发布时间】：2021-05-31 04:35:18
【问题描述】：

我在 Net 5.0 上有一个剃须刀页面项目。在这个项目中，我想同时使用 .cshtml 和 .razor 页面。（也许随着时间迁移到 .razor）。我可以在 .cshtml 页面上成功使用 razor 组件，但无法使 .razor 页面正常工作，总是出现“找不到此页面”错误。我关注了 Combining Razor and Blazor Pages in a Single ASP.NET Core 3 Application 和其他一些人，但仍然无法正常工作。

Startup.cs 有

services.AddServerSideBlazor();
and
endpoints.MapBlazorHub();
endpoints.MapFallbackToFile("/_Host.cshtml")

_Imports.razor 在根目录中：

@using System.Net.Http
@using Microsoft.AspNetCore.Authorization
@using Microsoft.AspNetCore.Components
@using Microsoft.AspNetCore.Components.Authorization
@using Microsoft.AspNetCore.Components.Forms
@using Microsoft.AspNetCore.Components.Routing
@using Microsoft.AspNetCore.Components.Web
@using Microsoft.AspNetCore.Components.Web.Virtualization
@using Microsoft.JSInterop

Pages/App.razor

@using Microsoft.AspNetCore.Components.Routing 
 <Router AppAssembly="@typeof(Program).Assembly"}">
    <Found Context="routeData">
        <RouteView RouteData="@routeData"/>
    </Found>
    <NotFound>
        <h1>Page not found123</h1>
        <p>Sorry, but there's nothing here!</p>
    </NotFound>
</Router>

页面/_Host.cshtml

@page "/blazor"
 
@{
    Layout = "_Layout";
}
 
<div id="app">
    @(await Html.RenderComponentAsync<App>(RenderMode.Server))
</div>

页面/共享/_Layout.cshtml

<script src="_framework/blazor.server.js"></script>

 @RenderSection("Scripts", required: false)

页面本身：Pages/Test.razor

@page "/test"
@implements IDisposable
<div>test</div>

我错过了什么？

【问题讨论】：

标签： c# asp.net-core blazor razor-pages asp.net-core-5.0

【解决方案1】：

这是我的剃须刀页面项目结构：

我将Shared文件夹添加到项目中，并将App.razor，_Imports.razor添加到项目中。将Counter.razor，_Host.cshtml添加到Pages Folder。在Startup.cs中添加配置。

Startup.cs：

public void ConfigureServices(IServiceCollection services)
        {
            services.AddServerSideBlazor();
            services.AddRazorPages();
        }
public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
        {
            if (env.IsDevelopment())
            {
                app.UseDeveloperExceptionPage();
            }
            else
            {
                app.UseExceptionHandler("/Error");
                // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
                app.UseHsts();
            }

            app.UseHttpsRedirection();
            app.UseStaticFiles();

            app.UseRouting();

            app.UseAuthorization();

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

_Imports.razor（最后两行RazorPageDemo5._0是我的项目名称，你的可以是@using projectname @using projectname.Shared）：

@using System.Net.Http
@using Microsoft.AspNetCore.Authorization
@using Microsoft.AspNetCore.Components.Authorization
@using Microsoft.AspNetCore.Components.Forms
@using Microsoft.AspNetCore.Components.Routing
@using Microsoft.AspNetCore.Components.Web
@using Microsoft.AspNetCore.Components.Web.Virtualization
@using Microsoft.JSInterop
@using RazorPageDemo5._0
@using RazorPageDemo5._0.Shared

页面/共享/_Layout.cshtml：

<script src="_framework/blazor.server.js"></script>
    @await RenderSectionAsync("Scripts", required: false)

Page/_Host.cshtml（将命名空间更改为您项目的）：

@page "/"
@namespace RazorPageDemo5._0.Pages
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@{
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <base href="~/" />
    <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css" />
    <link href="css/site.css" rel="stylesheet" />
</head>
<body>
    <component type="typeof(App)" render-mode="ServerPrerendered" />

    <div id="blazor-error-ui">
        <environment include="Staging,Production">
            An error has occurred. This application may no longer respond until reloaded.
        </environment>
        <environment include="Development">
            An unhandled exception has occurred. See browser dev tools for details.
        </environment>
        <a href="" class="reload">Reload</a>
        <a class="dismiss">?</a>
    </div>

    <script src="_framework/blazor.server.js"></script>
</body>
</html>

然后将 MainLayout.razor,NavMenu.Razor,SurveyPrompt.razor 添加到 Shared 文件夹。将 App.razor 添加到项目。

结果：

【讨论】：

非常感谢您的回答！我在根目录中缺少 MainLayout 和 Shared 文件夹。请问，你的App.razor长什么样子？现在我没有得到一个空页面，而是“发生了未处理的异常。有关详细信息，请参阅浏览器开发工具。重新加载?”
另外，当 _Host 页面“/”与 index.cshtml 文件冲突时，我将其更改为页面“/blazor”。没事吧？
在控制台日志中，我看到两次“将 '_blazor' 标准化为 'localhost:63478/_blazor'”，然后两次“WebSocket 连接到 ws://localhost:63478/_blazor?id=" 之后出现“错误: 应用批次 2 时出错。”和“错误：当前电路存在未处理的异常，因此该电路将被终止。”
太棒了，它正在工作！但是我不得不从_Host中删除，只保留在Layout中，否则会报错。
我来这里寻求指导。我只想说我最终确实让事情正常了，但是我不得不将讨厌的放在 _Host.cshtml 文件中。如果有人尝试了所有其他建议但仍然无法正常工作，请尝试将那条线移到那里。还有一件事。 wwwroot/css 文件夹中有几个文件夹需要复制。引导和开放标志性的。呈现主页需要这些样式。只需从工作的 blazor 应用程序中复制它们即可。