ABP应用开发（Step by Step）-下篇

🚀 优质资源分享 🚀

学习路线指引（点击解锁）	知识定位	人群定位
🧡 Python实战微信订餐小程序 🧡	进阶级	本课程是python flask+微信小程序的完美结合，从项目搭建到腾讯云部署上线，打造一个全栈订餐系统。
💛Python量化交易实战💛	入门级	手把手带你打造一个易扩展、更安全、效率更高的量化交易系统

测试 ProductAppService 类

启动模板附带测试基础架构，包括xUnit、Shouldly和NSubstitute库。它使用SQLite 内存数据库来模拟数据库，并为每个测试创建一个单独的数据库。它会自动初始化数据并在测试结束时销毁测试数据。通过这种方式，测试不会相互影响，并且您的真实数据库保持不变。
下面展示在 UI 上使用应用服务之前，如何为ProductAppService类的GetListAsync方法写单元测试代码（构建自动化测试细节后续再议）。
在.Application.Tests项目中创建Products文件夹，并在其中创建一个ProductAppService\_Tests类：

using Shouldly;
using System.Threading.Tasks;
using Volo.Abp.Application.Dtos;
using Xunit;
namespace ProductManagement.Products
{
 public class ProductAppService\_Tests : ProductManagementApplicationTestBase
 {
 private readonly IProductAppService \_productAppService;
 public ProductAppService\_Tests()
 {
 \_productAppService =
 GetRequiredService();
 }
 /* TODO: Test methods */
 }
}

该类继承自ProductManagementApplicationTestBase，它默认集成 ABP 框架和其他基础设施库，这样我们就可以直接使用内置的测试能力。另外，我们使用方法GetRequiredService来解决测试代码中的依赖关系，而不是构造函数注入（这在测试中是不可能的）。

现在，我们可以编写第一个测试方法。在ProductAppService\_Tests类中添加如下代码：

[Fact]
public async Task Should\_Get\_Product\_List()
{
 //Act
    var output = await \_productAppService.GetListAsync(
 new PagedAndSortedResultRequestDto()
 );
 //Assert
    output.TotalCount.ShouldBe(3);
 output.Items.ShouldContain(
 x => x.Name.Contains("Acme Monochrome Laser Printer")
 );
}

该方法调用该GetListAsync方法并检查结果是否正确。如果您打开测试资源管理器窗口（在 Visual Studio 中的查看|测试资源管理器菜单下），您可以看到我们添加的测试方法。测试资源管理器用于显示和运行解决方案中的测试：

运行测试到检查它是否按预期工作。如果方法正常工作，将在测试方法名称的左侧看到一个绿色图标。

自动 API 控制器和 Swagger UI

Swagger一款服务于开发和测试HTTP API 的的流行工具。它启动模板中已经预先装了。
设置.Web项目为启动项目，然后按 Ctrl+F5运行该项目，启动后，输入/swagger URL，如图所示：
你会看到内置的很多 API。如果向下滚动，也会看到一个Product接口。您可以对其进行测试以获取产品列表：

我们没有创建ProductController接口。这个接口是如何出现的？

这里运用的是ABP 框架的自动 API 控制器功能。它会根据命名约定和配置自动将您的应用服务公开为 HTTP API（通常，我们不会手动编写控制器）。
自动 API 控制器功能将在[第 14 章] 构建 HTTP API 和实时服务 中详细介绍。
有了 HTTP API 来获取产品列表。下一步是在客户端代码中使用此 API。

动态 JavaScript 代理

通常，您通过 JavaScript 调用 HTTP API 接口。ABP 会为所有 HTTP API 动态创建客户端代理。然后，就可以使用这些动态 JavaScript 函数从客户端调用我们的 API。
再次运行ProductManagement.Web项目，并在登录页面上使用F12快捷键打开浏览器的开发者控制台，然后输入以下 JavaScript 代码：

productManagement.products.product.getList({}).then(function(result) {
 console.log(result);
});

执行此代码后，将向服务器发出请求，并将返回结果记录在Console选项卡中，如图所示：

我们可以看到返回的产品列表数据显示在控制台选项卡中。这意味着我们可以轻松地运用 JavaScript 调用服务器端 API，而无需处理低级细节。
如果您想知道JavaScript 是在哪里定义getList的，您可以定位到/Abp/ServiceProxyScript地址，查看由 ABP 框架动态创建的 JavaScript 代理函数。

产品列表

推荐使用 Razor Pages在 ASP.NET Core MVC 框架中创建 UI。
首先，在ProductManagement.Web项目的Pages文件夹下创建一个Products文件夹。然后，右键单击Products文件夹，然后选择Add|Razor Page。选择Razor 页面 - 空选项，命名为Index.cshtml。下图显示了我们添加的页面的位置：
编辑内容，Index.cshtml如下代码块所示：

@page
@using ProductManagement.Web.Pages.Products
@model IndexModel
# Products Page

在这里，我放置一个h1元素作为页眉。接下来我们在主菜单中添加一个菜单来打开这个页面。

添加菜单项

ABP 提供了一个动态、模块化的菜单系统。每个模块都可以添加到主菜单。
打开ProductManagement.Web项目的**Menus文件夹中的ProductManagementMenuContributor类，并在ConfigureMainMenuAsync方法末尾添加以下代码：

context.Menu.AddItem(
 new ApplicationMenuItem(
 "ProductManagement",
 l["Menu:ProductManagement"],
 icon: "fas fa-shopping-cart"
 ).AddItem(
 new ApplicationMenuItem(
 "ProductManagement.Products",
 l["Menu:Products"],
 url: "/Products"
 )
 )
);

此代码添加了一个产品管理主菜单，其中包含产品菜单项。里面的l["…"]语法是用来获取本地