ASP.NET Core中的Razor页面介绍

目录
  • 简介
  • Why?
  • 创建Razor页面应用程序
  • ASP.NETCoreRazor页面-核心功能
    • 模型绑定
    • Handlers
    • TagHelpersandHTMLHelpers
    • 路由
  • 总结

简介

随着ASP.NET Core 2 即将来临,最热门的新事物是Razor页面。

Razor页面是ASP.NET Core的一个新功能,可以使基于页面的编程方式更容易,更高效。

大众的初步印象是对于那些只专注于页面的小型应用来说,Razor页面更容易、更快地取代MVC。然而,事实证明,它可能比这更强大。使用ASP.NET Core 2在创建新的应用程序时,Razor页面(空,Razor页面,Web API,MVC)是默认选项,似乎ASP.NET团队对Razor页面有更多的计划,并希望它成为创建Web应用程序时首选。

所有的Razor页面类型和特征都在Microsoft.AspNetCore.Mvc.RazorPages程序集中,MVC默认包Microsoft.AspNetCore.Mvc已经包含了Razor页面组件,这意味着您可以在MVC应用程序中直接使用Razor页面。

Razor页面的优点之一是设置和创建非常容易。您创建一个新的空项目,添加Pages文件夹,添加页面,只需在 .cshtml 文件中编写代码和标记。非常适合新手,是学习ASP.NET Core简单快速的方法!

Why?

如果您想使用MVC构建几个简单的页面,你需要将控制器 Action、HTML视图、视图模型、路由分别在单独的位置编写,这看起来似乎很过分了。

在Razor页面中,只有一个Razor文件(.cshtml),后台的代码也位于该文件内,该文件也表示应用程序的URL结构(稍后将会介绍)。因此,您可以将所有内容都放在一个文件中,就这么简单。

但是,您可以使用 .cshtml.cs 扩展名文件将后台代码分开。通常在该文件中包括视图模型和Handlers (如MVC中的Acion方法),也可以在该文件中的处理逻辑。当然,您也可以将您的视图模型移动到单独的文件中。

创建Razor页面应用程序

在VS 2017中安装.NET Core 2 SDK的情况下,如果我们按照这样的方式:文件 - > 新建项目 - > Web - > ASP.NET Core Web应用程序,我们将得到下面的窗口:

手动将身份验证类型改为“个人用户帐户”。

我们也可以通过CLI实现同样的效果

dotnet new razor --auth Individual

在dotnet CLI创建一个新项目之后,我们将在的项目中得到以下结构:

首先注意到是没有Views文件夹, 如果没有选择"授权"选项, 那么也不会有"Controllers"文件夹。在我们的例子中,有AccountController控制器,在 Pages 文件夹中包含Account 文件夹。该文件夹的中,我们存放Razor页面,在MVC中这些代码通常放在 ~Views/Account 文件夹中:

页面的默认位置是"Pages"文件夹,但可以更改

大部分页面都附带.cs文件,表示页面的模型:

在.cs文件中,我们可以定义我们的逻辑、Handlers(Action)、模型和所有需要的逻辑。我们也可以把它当作是.cshtml页面的粘合剂,仅处理GET / POST / PUT / DELETE,也可以将逻辑移到单独的类或层/项目中。

需要注意的一点是,我们需要在 .cshtml 文件的顶部定义 @page 指令。这告诉Razor这个 .cshtml 文件是Razor Page文件:

ASP.NET Core Razor页面 - 核心功能

由于Razor页面是MVC框架的一部分,我们可以在Razor页面中使用MVC所附带的任何功能。

模型绑定

在MVC中模型绑定也适用于Razor页面,就像MVC控制器中的Action方法一样,在Razor页面代码有Handlers 。

在ChangePassword页面.cshtml文件编写如下表单:

ChangePassword.cshtml.cs文件中实现ChangePasswordModel类:

这里是InputModel类:

InputModel提供了我们在MVC中熟悉的ViewModel功能。

Handlers

我们使用Handlers作为处理HTTP请求(GET,POST,PUT,DELETE ..)的方法。例如,我们可以有以下方法:

OnGet / OnGetAsyncOnPost / OnPostAsyncOnDelete / OnDeleteAsync

这些方法将由ASP.NET Core根据HTTP请求的类型自动匹配。

让我们回到之前ChangePassword的示例。这是ChangePassword.cshtml.cs文件的一部分代码:

OnGetAsyncOnPostAsync是Razor页面 handlers约定好了的名称。一旦您打开ChangePassword页面,OnGetAsync handler 将执行,当您从ChangePassword.cshtml页面提交表单,OnPostAsync handler 将被触发。

此外,我们可以将所有的页面代码放在 .cshtml 文件中。例如,我们可以将这两个函数从ChangePassword.cshtml.cs文件移动到ChangePassword.cshtml中:

关键字 @functions 指令,它使Razor文件范围内的代码成为功能级方法。

Tag Helpers and HTML Helpers

我们还可以在Razor页面内使用所有现有的Tag Helpers 和HTML Helpers;此外,可以创建自定义的帮助类,并在Razor页面中使用它们。

路由

我在GitHub中的小项目设置演示了如何使用Razor页面进行CRUD - 仓库链接 。您需要.NET Core 2.0 preview 3(build 6764 才能正常运行)或更高版本以及Visual Studio 2017.3或更高版本。

以下是所有文件的项目结构:

除了两个标准文件 Program.cs 和 Startup.cs ,一切都在Pages文件夹中;请注意,某些页面具有匹配的后台代码文件。

如前所述,项目中页面的位置(文件系统中的路径)将确定匹配的URL。

这里是一些重要页面文件和路由匹配的列表:

页面文件路径 匹配的URL
~Pages/Index.cshtml / , /Index
~Pages/Categories/Index.cshtml /Categories , Categories/Index
~Pages/Categories/Edit.cshtml /Categories/Edit/1
~Pages/Categories/Create.cshtml /Categories/Create

总结

  • Razor页面是以网页为重点的Web编程方式
  • 您可以(如果您想)在一个文件中实现所有的代码和HTML
  • Razor页面文件的路径决定了您的页面的URL/路由
  • 这不是老的ASP.NET网页的新实现
  • 在MVC中可以使用的的功能,我们也可以Razor页面中使用:
    • 模型绑定
    • Razor支持
    • Tag Helpers
    • HTML Helpers
    • Handlers (Action方法)
    • 等等...
  • 我们有(OnGet,OnGetAsync,OnPostAsync等)Handlers
  • 文件系统(项目结构)中的页面位置决定URL路径
  • 需要一个根文件夹
  • 默认存储在 Pages 根文件夹中(可配置)

到此这篇关于ASP.NET Core中的Razor页面介绍的文章就介绍到这了。希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • 如何ASP.NET Core Razor中处理Ajax请求

    在ASP.NET Core Razor(以下简称Razor)刚出来的时候,看了一下官方的文档,一直没怎么用过. 今天闲来无事,准备用Rozor做个项目熟练下,结果写第一个页面就卡住了..折腾半天才搞好,下面给大家分享下解决方案.先来给大家简单介绍下Razor Razor Pages是ASP.NET Core的一项新功能,可以使编页面的编程方案更简单,更高效.Razor页面使用处理程序方法来处理传入的HTTP请求(GET / POST / PUT / Delete).这些类似于ASP.NET MV

  • ASP.NET Core 2.0中Razor页面禁用防伪令牌验证

    在这篇短文中,我将向您介绍如何ASP.NET Core Razor页面中禁用防伪令牌验证. Razor页面是ASP.NET Core 2.0中增加的一个页面控制器框架,用于构建动态的.数据驱动的网站:支持跨平台开发,可以部署到Windows,Unix和Mac操作系统. 跨站点请求伪造(也称为XSRF或CSRF)是对Web托管应用程序的攻击,因为恶意网站可能会影响客户端浏览器和浏览器信任网站之间的交互.这种攻击是完全有可能的,因为Web浏览器会自动在每一个请求中发送某些身份验证令牌到请求网站.这种

  • ASP.NET Core Razor 页面路由详解

    在服务器端 Web 应用程序框架中,其中非常重要的设计是开发人员如何将URL与服务器上的资源进行匹配,以便正确的处理请求.最简单的方法是将 URL 映射到磁盘上的物理文件,在 Razor 页面框架中,ASP.NET团队就是这样实现的. 关于 Razor 页面框架如何将 URL 与文件相匹配,有一些规则您必须了解,以及如何根据需要自定义规则改变输出的结果.如果您将 Razor 页面与 Web Form 框架进行比较,您还需要了解取代的 Ur l参数以及在URL中传递数据的机制. 规则一,Razor

  • asp.net core razor自定义taghelper的方法

    又一个新的名词(taghelper),通过taghelper是可以操作html标签.条件输出.更是自由添加内外元素.当然也内置了挺多的asp-开头的taghelper. 下面文章中也简单的带大家实现一个taghelper; 创建自定义html元素 创建一个类ButtonTagHelper tagName为标签名称,下面创建一个button标签 using Microsoft.AspNetCore.Razor.TagHelpers; namespace Ctrl.Core.Tag.Controls

  • ASP.NET Core中的Razor页面介绍

    目录 简介 Why? 创建Razor页面应用程序 ASP.NETCoreRazor页面-核心功能 模型绑定 Handlers TagHelpersandHTMLHelpers 路由 总结 简介 随着ASP.NET Core 2 即将来临,最热门的新事物是Razor页面. Razor页面是ASP.NET Core的一个新功能,可以使基于页面的编程方式更容易,更高效. 大众的初步印象是对于那些只专注于页面的小型应用来说,Razor页面更容易.更快地取代MVC.然而,事实证明,它可能比这更强大.使用A

  • ASP.NET Core中的Razor页面使用视图组件

    视图组件简介 在新的ASP.NET Core MVC中,视图组件类似于局部视图,但它们更强大.视图组件不使用模型绑定,仅依赖于您在调用时提供的数据. 视图组件特性: 呈现页面响应的某一部分而不是整个响应 包括在控制器和视图之间发现的关注分离和可测试性优势 可以具有参数和业务逻辑 通常在页面布局中调用 视图组件是在任何地方可重用的呈现逻辑,对于局部视图来说相对复杂,例如: 动态导航菜单 标签云(查询数据库) 登录面板 购物车 最近发表的文章 典型博客上的侧边栏内容 将在每个页面上呈现的登录面板,并

  • ASP.NET Core中的Razor页面实现路由功能

    在服务器端 Web 应用程序框架中,其中非常重要的设计是开发人员如何将URL与服务器上的资源进行匹配,以便正确的处理请求.最简单的方法是将 URL 映射到磁盘上的物理文件,在 Razor 页面框架中,ASP.NET团队就是这样实现的. 关于 Razor 页面框架如何将 URL 与文件相匹配,有一些规则您必须了解,以及如何根据需要自定义规则改变输出的结果.如果您将 Razor 页面与 Web Form 框架进行比较,您还需要了解取代的 Ur l参数以及在URL中传递数据的机制. 规则一,Razor

  • 利用ASP.Net Core中的Razor实现动态菜单

    目录 准备 1.实现思路 2.编码 2.1  建立渲染内容填充方法 2.2  建立分部视图 2.3 调用分布视图 准备 1.框架 .netcore  版本 yishaadmin开源框架 2.模板 本文模板使用adminlte3.0,文档地址 3.菜单表关键字段 id 表主键(当前菜单) ParentId 父级ID(父级菜单 为0时为顶级菜单,也可能为内容) MenuUrl 菜单地址(只有页面有地址,本身菜单是空) MenuType 菜单类型(1是菜单 2是页面 3是按钮) MenuIcon 图标

  • ASP.NET Core中的对象池介绍

    asp.net core中通过扩展库的方式提供给了一个标准的对象池ObjectPool,定义在Microsoft.Extensions.ObjectPool.dll 程序集中.它本身是个纯虚的抽象类,它就定义了两个接口函数,实现如下 public abstract class ObjectPool<T> where T : class { public abstract T Get(); public abstract void Return(T obj); } 这是一个比较典型的对象池接口:

  • ASP.NET Core中的Blazor组件介绍

    目录 关于组件 组件类 静态资产 路由与路由参数 组件参数 请勿创建会写入其自己的组参数属性的组件 子内容 属性展开 任意参数 捕获对组件的引用 在外部调用组件方法以更新状态 使用 @ 键控制是否保留元素和组件 指定基类 指定属性 导入组件 原始 HTML 项目 Blazor 中,使用 .razor 结尾的文件,称为组件:而 Blazor 中的组件,正式名称是 razor 组件: Blazor 组件是 razor 过渡而来的,使用 razor 的基本语法特性,但是 Balzor 不支持 razo

  • ASP.NET Core中的静态文件介绍

    静态文件(HTML,CSS,图片和Javascript之类的资源)会被ASP.NET Core应用直接提供给客户端. 静态文件通常位于网站根目录(web root) <content-root>/wwwroot文件夹下.通常会把项目的当前目录设置为Content root,这样项目的web root就可以在开发阶段被明确. public static IWebHostBuilder CreateWebHostBuilder(string[] args) => WebHost.Create

  • ASP.NET Core中的Ocelot网关介绍

    目录 1.简介 2.Ocelot配置 2.1基础集成(Basic Implementation) 2.2集成IdentityServer(With IdentityServer) 2.3多个网关实例集群(Multiple Instances) 2.4集成Consul服务发现(With Consul) 2.5集成Service Fabric(With Service Fabric) 3.总结 1.简介 Ocelot原本设计仅为与.NET Core一起使用的,它是一个.NET API网关,作为面向使

  • ASP.NET Core中Razor页面与MVC区别介绍

    作为.NET Core 2.0发行版的一部分,还有一些ASP.NET的更新.其中之一是添加了一个新的Web框架来创建“页面”,而不需要复杂的ASP.NET MVC.新的Razor页面是一个比较简单的MVC框架版本,在某些方面是老的“.aspx” WebForms的演变. 在本文中,我们将介绍使用ASP.NET Razor页面和MVC的一些细节. Razor页面基础知识 ASP.NET MVVM vs MVC Razor页面的优点和缺点 使用Handlers实现多个GET.POST Action方

  • ASP.NET Core中Razor页面的Handlers处理方法详解

    简介 在前一篇文章中,我们讨论了Razor页面.今天我们来谈谈处理方法(Handlers). 我们知道可以将代码和模型放在 .cshtml 文件里面或与 .cshtml 匹配的 .cshtml.cs 文件中. Razor页面处理程序或处理方法将用户请求匹配到我们的方法:请求来自 **.cshtml **文件. Razor页面遵循特定的命名约定.从上一篇文章可以看出,.NET Core开发工具自动生成了很多处理方法,例如下面这些: OnGet OnPost OnGetAsync OnPostAsy

随机推荐