如何在 Angular 中模拟 HTTP 调用？

Question

我的 objective 不是编写单元或集成测试，而是构建一个演示应用程序，展示调用使用 HttpClient 模块的不同端点 URL 的案例组件。我想在不构建后端服务器（例如节点 Express）的情况下模拟这些端点 URL，因为我们希望它运行完全在 NGINX 上并且独立。

HttpClientTestingModule 是正确的模块吗？它似乎是用来编写测试用例的，或者我可能只是不知道如何使用它来构建演示应用程序。

Answer 1

要创建假后端，您当然可以使用 HttpInterceptor。

这篇link将帮助您：https://jasonwatmore.com/post/2020/07/18/angular-10-fake-backend-example-for-backendless-development

Answer 2

您可以使用 In-memory Web API 来模拟后端。查看教程：https://angular.io/tutorial/toh-pt6#simulate-a-data-server 您可以在其中安装 angular-in-memory-web-api。请记住在实际开始使用后端时将其删除，因为这会干扰它。

我更愿意使用可观察对象（或其他答案中提到的 HttpInterceptor）来模拟后端调用。

当您真正使用 API 时，所有方法都将存在，您只需改为使用 HttpClient。

因此，例如获取项目列表，您可以只使用 of rxjs 运算符，就像这样：

服务：

myData = [{id: 1, name: 'one'}] as MyType[];

getData() {
  return of(this.myData);
}

在您订阅的组件中，我更喜欢模板中的异步管道。

如何在 Angular 中模拟 HTTP 调用？

How do I mock HTTP calls in Angular?

mocking

angular