上一节课我们对 ASP.NET Core 平台有了整体的认识，理解了 ASP.NET Core 平台的三大 Web 应用程序框架 MVC、Razor Pages 和 Blazor。下面我们将使用 MVC 框架来改造书大师项目，其它框架将在后续功能实例中演示。
下面请大家跟着我写代码，关键代码我都会简单解释一下，但具体涉及的知识点（比如依赖注入和路由等），我会在后面章节专门讲解，如果暂时不是很理解也没关系。
1 启用 MVC 框架
要启用 MVC 框架，先要在 Program.cs 中注册相关服务和中间件，不过，在此之前要把之前 Razor Pages 相关注册代码删除（或注释掉）。Program.cs 代码如下：
var builder = WebApplication.CreateBuilder(args);
// 注册服务
// builder.Services.AddRazorPages();
builder.Services.AddControllersWithViews();
var app = builder.Build();
// 注册中间件
app.UseStaticFiles();
// app.MapRazorPages();
app.MapDefaultControllerRoute();
app.Run();这里的 app.Services.AddControllersWithViews() 集中注册了一系列和控制器和视图相关的服务，比如视图引擎、认证、跨域等组件服务，这样我们可以通过依赖注入的方式在任意类中使用框架提供的接口。关于依赖注入的知识点，后续会专门讲。
和之前的 app.MapRazorPages() 类似，这里的 app.MapDefaultControllerRoute() 则是用于注册和配置路由，映射到具体的 Controller 的 Action 端点，默认规则是 {controller=Home}/{action=Index}/{id?}。
可以看到，启用 MVC 和 Razor Pages 之间的区别就是两行代码的区别。
2 使用 MVC 文件结构
根据 MVC 模式，一般约定俗成地将 MVC 的三个部分对应到三个文件夹，即 Models、Views 和 Controllers。于是，我们在 Bookist.Web 项目根目录创建好这三个文件夹。接着就是在各个文件夹中添加相应的代码文件了。
如果你使用 VSC 开发，在创建代码文件之前，这里先分享一个 VSC 插件：vscode-solution-explorer。该扩展识别到你是 .NET 项目时，第一次打开项目它会询问你是否要生成默认的模板文件，生成的模板文件在 .vscode/solution-explorer 目录下，我们可以根据需要自义修改这些模板。这样每次添加文件时就不需要每次都输入一些固定的内容了，比如命名空间的声明。
安装完 vscode-solution-explorer 插件后，会在 VSC 左侧的工具栏中看到一个 VS 图标的 Tab。在该 Tab 中添加 C# 文件和引用都非常方便，和 VS 差不多。操作很简单，大家自己实践一下就知道了，具体也可以查看插件的介绍。
下面继续在 Models、Views 和 Controllers 文件夹中添加相应的三个代码文件，具体如下图所示。
![[.NET大牛之路 034] 实战：使用 MVC 模式改造书大师](https://myblog-file-1257411902.cos.ap-shanghai.myqcloud.com/wp-content/uploads/2021/11/image-10.png)
![[.NET大牛之路 034] 实战：使用 MVC 模式改造书大师](https://www.zhengchaoqiang.com/wp-content/themes/justnews/themer/assets/images/lazy.png)
3 代码修改
在 Models/BookVM 类中，我们定义一个 Model 类，用于承载视图数据：
namespace Bookist.Web.Models;
public class BookVM
{
public string Title { get; set; }
public string Cover { get; set; }
public string Author { get; set; }
public DateOnly PubDate { get; set; }
public string Description { get; set; }
public string Format { get; set; }
public string FetchUrl { get; set; }
public string FetchCode { get; set; }
}现在我们把原先的 Pages/Index.cshtml 文件的内容复制到 Views/Home/Index.cshtml 中，指定绑定的数据模型为 BookVM，并移除原来的 book 对象及 @page 声明，相关代码如下：
@model Bookist.Web.Models.BookVM
<!DOCTYPE html>
....
<div class="book-card">
<img src="@Model.Cover" />
<div class="book-card__body">
<div class="book-card__info">
<h3>@Model.Title</h3>
<dl>
<dt>作者:</dt>
<dd>@Model.Author</dd>
</dl>
<dl>
<dt>日期:</dt>
<dd>@Model.PubDate.ToString("yyyy年MM月")</dd>
</dl>
<dl>
<dt>简介:</dt>
<dd>@Model.Description</dd>
</dl>
</div>
<div class="book-card__oprate">
<a class="btn-primary" href="@Model.FetchUrl" target="_blank">下载 @Model.Format</a>
<span>提取码：<b class="book-card__code">@Model.FetchCode</b></span>
</div>
</div>
</div>
...注：完整代码请前往 bookist.cc 的 GitHub 仓库查看。
最后在 Controller 中定义一个和默认首页（URL 为/或/Home/Index）对应的 Index Action 方法，在 Action 方法中返回视图需要的 Model 及其数据，代码如下：
using Bookist.Web.Models;
using Microsoft.AspNetCore.Mvc;
namespace Bookist.Web.Controllers;
public class HomeController : Controller
{
public ViewResult Index()
{
var vm = new BookVM
{
Title = "CLR via C# (4th Edition)",
Cover = "https://img.geekgist.com/Foc1d-NbacAQ6D1WSQ_3UndhaOuR-w2h3",
Author = "Jeffrey Richter",
PubDate = new DateOnly(2012, 10, 1),
Description = "Dig deep and master the intricacies of the CLR, C#, and .NET development. You’ll gain pragmatic insights for building robust, reliable, and responsive apps and components.",
Format = "PDF",
FetchUrl = "https://url19.ctfile.com/f/15677019-228693113-e89578",
FetchCode = "bookist"
};
return View(vm);
}
}可以看到，这里基本只是文件结构的修改，把原来 Pages/Index.cshtml 的内容拆分到 MVC 的三个部分中去，这样做可以使项目结构更清晰，也更容易维护。
4 发布
在项目的 Bookist.Web 目录下，运行如下命令生成发布文件：
$ dotnet publish -c release -o bin/Publish每次发布更新，我们只需要把有改动的文件复制上去就行，这次我们只需要复制 Bookist.Web.* 开头的两个文件到服务器上。
向云服务器拷文件，我个人使用的是 Xftp 工具。它有个很方便的技巧，可以在 Xftp 工具上直接打开 Xshll，并自动定位到当前目录。
![[.NET大牛之路 034] 实战：使用 MVC 模式改造书大师](https://myblog-file-1257411902.cos.ap-shanghai.myqcloud.com/wp-content/uploads/2021/11/image-11.png)
把发布文件复制到服务器上后，别忘了运行如下命令重启应用：
$ systemctl restart bookist最后用浏览器访问一下网站检查一下是否一切正常。
本文来自http://cnblogs.com/willick，经授权后发布，本文观点不代表个人技术分享立场，转载请联系原作者。
微信扫一扫 
支付宝扫一扫 