是否可以直接路由到MVC应用程序中托管的blazor页面

发布时间：2023-02-17 09:04:16 所属栏目：asp.Net 来源：互联网

导读：如何解决是否可以直接路由到MVC应用程序中托管的blazor页面？？我有一个现有的.net core 3.1 MVC应用程序，已经开始向其添加Blazor组件。这非常好，组件可以按预期方式渲染和工作。目前，要进入使用Blazor的页面，我要添加一个控制器动作和一个视图来处理路

　　如何解决是否可以直接路由到MVC应用程序中托管的blazor页面？？
　　我有一个现有的.net core 3.1 MVC应用程序，已经开始向其添加Blazor组件。这非常好，组件可以按预期方式渲染和工作。目前，要进入使用Blazor的页面，我要添加一个控制器动作和一个视图来处理路由，然后将component标签添加到视图中以呈现Blazor组件。

　　因此，假设我有一个Customer Blazor组件，它实际上是一个客户“页面”，请执行以下操作。

　　添加控制器和操作，在本示例中，我将添加带有“索引”操作的“客户”控制器
　　我添加相应的索引视图
　　在我的应用程序的Pages文件夹中创建一个Customer Blazor组件
　　在视图中，我使用组件标签助手来加载Blazor组件： <component type="typeof(MyApp.Pages.Customers)" render-mode="Server" />
　　就像我说的那样，所有这些工作都很好，对于我添加的使用Blazor的每个页面来说，这只是很多开销。能够仅对页面使用内置的Blazor路由会很好。如果这行得通，我可以在Pages文件夹中添加Customer Blazor组件，并像这样添加@page标签： @page "/Customers"

　　不幸的是，这不起作用，如果尝试使用此方法，我会得到404。

　　我已按照本文中的说明进行操作，但仍然收到404： https://docs.microsoft.com/en-us/aspnet/core/blazor/components/integrate-components?view=aspnetcore-3.1#use-routable-components-in-an-mvc-app

　　有人能做到这一点吗？甚至有可能吗？

　　谢谢！

　　解决方法
　　开始以全新的 dotnet new mvc 应用程序结束，这就是您可以在 .NET 5.0 ...

　　在 ConfigureServices 内，添加：

　　services.AddRazorPages();
　　services.AddServerSideBlazor();
　　在 Configure 下方的 UseEndpoints 内，添加：

　　endpoints.MapFallbackToPage("/_Host");
　　endpoints.MapBlazorHub()
　　在主布局内，添加 blazor 服务器 js

　　<script src="_framework/blazor.server.js"></script>
　　使用 _Imports.razor 文件，参考：Microsoft.AspNetCore.Components.Web

　　这是一个框架类库，因此不需要 NuGet 包
　　确保它在您的 Blazor 组件的范围内！
　　添加 _Host.cshtml 文件（从 Blazor 应用中提取）

　　这应该引用 MVC _Layout 文件，并且除 App 组件外为空白
　　页面路由应该是唯一的路由（就像对 API 的 SPA 调用一样）
　　// _Host.cshtml
　　@page "/blazor"
　　@namespace BlazorTechTalk.MvcWithBlazorUI.Pages
　　@addTagHelper *,Microsoft.AspNetCore.Mvc.TagHelpers
　　@{
　　 Layout = "~/Views/Shared/_Layout.cshtml";
　　}
　　<component type="typeof(App)" render-mode="ServerPrerendered" />
　　添加 App.razor 组件（来自 Blazor 应用）

　　添加 MainLayout 组件（来自 Blazor 应用）

　　这应该是空白的，此外：
　　@inherits LayoutComponentBase
　　@Body
　　呼，大功告成，现在可以在 MVC 项目中添加 BlazorPage.razor 个页面和组件！

　　@page "/blazorpage"
　　<h3>BlazorPage</h3>
　　以防万一有人偶然发现这一点并且只需要 Blazor 组件

　　执行第 1-4 步，但您可以省略：

　　services.AddRazorPages();
　　endpoints.MapToFallbackFile("/Host");

（编辑：甘南站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!