构建Postman Clone：添加PUT、PATCH和DELETE

在 Tim Corey 的 YouTube 视频"PUT、PATCH 和 DELETE：创建一个 Postman 克隆课程"中，我们继续通过学习如何处理剩余的 HTTP 动词来构建一个 Postman 克隆。 在上一节课中，我们实现了 POST 命令以及 GET 请求。 本课重点在于 PUT、PATCH 和 DELETE，完成我们自己的 Postman 样式 API 客户端的基本功能。 遵循 Tim 的指导，我们对 API 的工作原理以及开发人员如何以编程方式与它们交互有了更深入的了解。

Tim 从介绍新功能开始这节课，说明这是完整课程中的第八课。 他强调，虽然这个项目对初学者友好，可以作为投资组合的例子，但重要的是使您的工作独一无二，而不仅仅是直接复制代码。

更新应用程序中的下拉菜单和选项

Tim 从显示应用程序的设置开始。目前，下拉菜单允许选择 GET 和 POST。为了构建一个功能齐全的 Postman 克隆，我们需要在选项列表中添加 PUT、PATCH 和 DELETE。

在属性中，Tim 更新了下拉菜单项，使五个 HTTP 动词都显示为可选项：GET、POST、PUT、PATCH、DELETE。 他强调，下拉选择必须与后端使用的 Enum 匹配，该 Enum 定义了 API 客户端的有效 HTTP 操作。 这确保用户从下拉列表中选择时，过程可以正确映射到底层代码逻辑。

将用户选择映射到 HTTP 操作

Tim 解释了该应用程序如何将用户在下拉菜单中的选择转换为特定的 HTTP 请求方法。 系统首先验证在表单 HTML 输入中输入的 URL，然后将选定的选项解析为普通 JavaScript 中的 HTTP 操作。

此设置允许应用程序将三条关键信息传递给 CallApiAsync 方法：

1. 表单 HTML 输入中的 URL。

2. 通过表单 JavaScript 区域或 JSON 文本编辑器输入的主体内容，通常为 JSON。

3. 与 HTTP 动词对应的选定操作。

这确保了 Postman 克隆能够处理不同类型的请求，并返回正确的响应 JavaScript 以显示在响应 HTML 部分。

实现 PUT、PATCH 和 DELETE 方法

Tim 演示了处理 PUT、PATCH 和 DELETE 所需的代码：

• PUT：更新完整的记录。 API 客户端发送一个完整的 JSON 对象，覆盖给定 ID 的所有字段。

• PATCH：仅更新特定字段。 当您想修改记录的一部分而不影响其他数据时，这很有用。

• DELETE：完全删除记录。 它只需要 URL 和 ID； 不发送任何内容。

Tim 注意到 DELETE 略有不同，因为它不返回内容，只返回成功确认。 这些更改完全在普通 JavaScript 中实现，修改 CallApiAsync 方法以处理所有选择和操作。

测试功能

Tim 强调验证每个 HTTP 方法是否按预期工作的重要性。

1. GET：Tim 在下拉菜单中选择 GET 并获取帖子。 API 客户端返回正确的响应 JavaScript，在响应 HTML 部分中显示数据。

2. PUT (5:01)：对于 PUT，Tim 使用 ID、标题、主体和用户 ID 更新完整记录。 他展示了返回的 JSON 与提交的数据匹配，确认过程正常工作。

3. PATCH (6:10)：Tim 通过仅更新记录的标题来演示 PATCH。 Postman 克隆保留其他字段不变，证明其能够有效处理部分更新。

4. DELETE (7:32)：DELETE 仅需要记录 ID。 Tim 执行请求并通过空括号确认成功，表明记录已被删除且不会返回不必要的数据。

通过此过程，Tim 演示了如何使 Postman 克隆执行所有 CRUD 操作：创建 (POST)、读取 (GET)、更新 (PUT/PATCH) 和删除 (DELETE)。

更改和设置总结

Tim 总结了增强 API 客户端所需的关键步骤和代码更改：

• 更新下拉菜单以包含所有 HTTP 动词（选项）。

• 确保后端的 Enum 与每个动词匹配，以便选择能够正确映射到方法。

• 修改 JavaScript 中的 CallApiAsync 方法以处理附加动词并适当处理数据。

他指出一个可选的增强功能：对于 DELETE，可以返回一个简单的成功消息而不是序列化输出，从而简化用户体验。

Postman 克隆的当前状态和功能

此时，Postman 克隆已具备五个 HTTP 动词的功能。 用户可以输入 URL，通过表单 JavaScript 编辑器提交 JSON 数据，并在响应 HTML 显示中接收响应。

然而，Tim 指出了一些可以增强应用程序的附加功能：

• 支持 XML 请求。

• 处理认证。

• 添加自定义标头。

这些为开发人员提供了扩展克隆并使其更具通用性的机会。

Tim 对增强您自己的 Postman 的建议

Tim 鼓励观众继续构建和改进他们的 Postman 克隆：

• 使用 WPF、Blazor 或普通 HTML/JavaScript 框架添加 Web 用户界面。

• 包括附加的 API 并处理不同的数据格式。

• 在下拉菜单中测试不同的选项并扩展功能以获得更丰富的功能。

• 在 GitHub 上分享您的项目，以向潜在雇主展示仓库、代码和过程。

他强调实践是关键：构建、测试和迭代项目有助于深入理解 API 和编程概念。

结论

Tim 在 视频 结束时鼓励实验。 他喜欢 tinkering 测试应用程序，并强调开发者通过不断迭代提高。

虽然系列的 GitHub 代码尚未立即提供，但可能会在未来的 Dev Pass 中发布。 目前的目标是让学习者从零开始构建他们自己的 Postman 克隆，实践设置、过程和代码实现，同时使项目独一无二。

通过遵循 Tim 的方法，开发人员可以创建一个功能齐全的 API 客户端，理解 HTTP 方法，并制作一个投资组合准备的项目，展示对表单 HTML、响应 JavaScript 和 JSON 处理的实际技能。