Razor 页面与服务器端 Blazor

Posted

技术标签:

【中文标题】Razor 页面与服务器端 Blazor【英文标题】:Razor Pages vs server-side Blazor 【发布时间】:2020-04-03 08:38:32 【问题描述】:

Razor Pages 用于服务器端 Web 应用程序,就像过去一样。

Blazor 旨在为流行的 javascript 框架(如 Angular 或 React)提供替代方案,以创建(主要)在客户端浏览器中运行的单页应用程序 (SPA)。

但是,我也听说过服务器端 Blazor,这让我很困惑。根据this answer 的说法,服务器端 Blazor 只是在服务器上运行的 Razor 组件。但是 Razor 页面和 Razor 组件之间有什么区别?

注意:我并不是想弄清楚哪个更好或“正确的选择”。我只是想弄清楚存在哪些技术差异。

【问题讨论】:

这能回答你的问题吗? Blazor vs Razor @Flores 差不多,但不完全。与大多数其他帖子一样,该帖子主要针对 Razor 与客户端 Blazor (SPA)。在这种情况下,差异非常明显。我的困惑只有在主题落在服务器端 Blazor 时才开始(尽管下面的答案肯定有助于我的理解)。不过我很感激它,它绝对值得一读:-) hanselman.com/blog/what-is-blazor-and-what-is-razor-components espressocoder.com/2019/02/21/… 【参考方案1】:

最大的区别是剃须刀页面在服务器上呈现并将整个页面发送到客户端。 Blazor 服务器端仅通过信号器连接发送 DOM 更改。所以没有页面重新加载。您需要在服务器上运行 asp.net 核心才能使用此技术。

Blazor webassembly 完全是客户端。对 DOM 的更改是“本地”应用的,这可以从静态网络服务器托管。

【讨论】:

【参考方案2】:

Razor Components,顾名思义,用于为网页创建可重用组件。

Razor pages 是网页和控制器在一个文件中的组合。

Razor components 主要由Blazor 使用,但它们也可以在Razor Pages 中使用,尽管它们被设计为更原生于Blazor

您无法在没有页面托管的情况下显示Razor Component,但您可以在没有Razor components 的情况下显示Razor Pages

Razor Components 从 .NET Core 3.0 开始可用。

Razor Pages 从 .NET Core 2.1 开始可用。

编辑

RazorPages 分为 html 页面和 .cs 代码文件。而Razor Components 通常将.cs 和 HTML 放在一个文件中,尽管它们可以分为 HTML 和代码隐藏文件。

Razor PagePageModel 允许 ASP.NET Core 将控制器返回的数据绑定到页面中的公共属性,然后在页面中使用该属性来引用模型。您可以使用 PageModel 类中的属性来引用代码中的数据,并使用 HTML 中的 @model 属性来引用相同的属性。

Razor Components 不绑定到模型,而是使用参数为它们分配值,类似于将值和事件分配给标准 HTML 元素的方式。 seen here 就是一个例子。

【讨论】:

您能否解释一下 RazorPages 使用的 Razor ComponentPageModel 之间的区别? “从 .NET Core 3.0 开始提供 Razor 组件”... 你确定吗?正如你所说的完全错误。 “而 Razor 组件将 .cs 和 HTML 放在一个文件中”......你也错了。 Razor 组件可以包含两部分:由 Html 标记与 Razor 语法混合而成的视图部分和代码部分(@code 块)。但是 Razor 组件,就像 Razor 页面一样,可以分为两部分:视图部分 (.razor) 和代码部分或后面的代码,如果您愿意 (.razor.cs)。我还可以补充一点,这是通过使用部分关键字来完成的...... @enet 感谢您的提醒。我已经编辑了关于 Razor Components 在文件之间拆分的答案。至于 .NET Core 3.0 以后的版本,我仍然认为这是正确的。 Razor Components 是在 .NET Core 3.0 中提供的 Blazor 的一部分。如果您认为它们在早期版本中可用,请告诉我 组件从一开始就在 Blazor 中可用,无论使用什么名称来指代它们......但是,以下来自文档: Blazor 中的组件正式称为 Razor组件【参考方案3】:

但是 Razor 页面和 Razor 组件之间有什么区别?

Blazor 存在一些令人困惑的命名问题。

Blazor 不是 Razor,但 Blazor 页面/组件打包在 .razor 文件中。 Razor 使用 .cshtml 文件。

Blazor 组件可以在 Razor 页面上使用。

Blazor 服务器端曾短暂命名为“Razor Components”,但已回滚。

我只是想弄清楚存在哪些技术差异。

Razor 页面是在服务器上生成 HTML 的轻量级 MVC 分支。

Blazor 是一个组件框架,可以直接在浏览器(WebAssembly)中运行,也可以在服务器上运行。在这两种情况下,它都会对浏览器 DOM 进行小的更新。

【讨论】:

【参考方案4】:

首先,这里应该提到的是,Blazor Server App 和 Blazor WebAssembly App 的组件模型是一回事。唯一的区别是他们的执行方式。 Blazor 服务器应用程序(也称为服务器端 Blazor 应用程序)在服务器上执行,并且在用户单击按钮元素之后从这种执行产生的 Html 内容通过 a 发送到客户端(可能是浏览器) SignalR 连接。另一方面,Blazor WebAssembly 应用程序,也称为客户端 Blazor 应用程序,在用户的浏览器上执行;即 C# 代码在浏览器中运行在一个进程中,在该进程结束时输出 Html 内容并在浏览器中呈现。

但是 Razor 页面和 Razor 组件之间有什么区别?

Razor 组件是在 Blazor 的两种执行模式中使用的组件模型。组件是通常派生自 ComponentBase 类的代码单元。它可能包含两部分:由混合了 Razor 语法的 Html 标记组成的视图部分和 C# 代码的代码部分。一个组件可以是另一个组件的子组件,但也可以是一个页面组件;这是一个组件,在呈现时构成整个 Html 文档。

Razor Pages 是一个 Web 框架,就像 MVC 框架一样。使用 Razor 页面时,您创建的页面使用 Razor 语法和 C#,就像 Blazor 一样,乍一看,这解释了为什么它们看起来如此相似。但是,Razor 页面仅在服务器上创建,并且 Html 内容被输出(渲染)并推送到用户的浏览器。它们的架构不同,您需要学习一系列课程才能在其中任何一个中进行编程。总而言之,唯一的相似之处是 Razor 语法和 C# 的使用。语言是误解的根源,在编程世界中,它比以往任何时候都更能体现为 Blazor 的命名(命名更改发生了多次)并在不知不觉中将其与 Razor Pages 识别。除此之外,您可以在 Razor 页面中嵌入 Razor 组件这一事实似乎是进一步混淆的根源。

【讨论】:

以上是关于Razor 页面与服务器端 Blazor的主要内容,如果未能解决你的问题,请参考以下文章

无法在默认 Blazor 服务器端项目中找到 Razor 页面

从 Blazor 组件 (.razor) 重定向到 Razor 页面 (.cshtml) [服务器端]

如何从服务器端 Blazor 应用程序中的 Blazor 组件调用 razor 页面而不导致页面刷新

Blazor 脚手架注册页面为啥 .cshtml 不是 .razor 文件?

什么是 Razor,它和 Blazor 有什么关系?

Blazor 服务端组件 Render, RenderFragment ,RenderTreeBuilder, CascadingValue/CascadingParameter