如何构建Angular 6 http服务？

Question

当前，我将对后端的每个API调用都放在一个文件webService.ts下。

但是随着我的API变得越来越复杂，将有很多请求路径，并且webServices.ts可能非常长且难以管理。

为大型项目管理所有API调用服务的正确方法是什么？

我正在使用angular / common / http。

谢谢！

Answer 1

您可以发出 generic adapter 进行GET / POST / PUT请求，该请求将接受其他服务的类型和网址。

将通过具有必要参数的相关组件服务来调用通用服务。

我也建议使用 HttpClient.

Answer 2

首先，创建一个包含常见内容的BaseApiService抽象类，例如：

如果将响应转换为模型，请创建一种方法以使其尽可能通用。记住要一般键入此类，请使用打字稿作为您的朋友。

如果您已经有很多服务，将很容易识别可以提取到该类的通用和重复代码。

此抽象类可能包含一些常量，例如api url或一些您可以使用的参数，例如默认页面大小...

然后，您可以通过扩展此类并覆盖必要的内容来创建特定的服务。

请勿使用common / http。 HttpClient更好，更灵活，例如允许使用拦截器。拦截器的一个很好的用途是自动将标有auth令牌的标头附加到所有请求。

我可以为您提供大量的提示，但我在手机上打字。 :-D

更新

现在我正在使用计算机，请看一下我的ApiProvider，希望它可以为您提供帮助。

Answer 3

我们将前端http服务的结构与后端服务相对应。因此，当后端具有/api/product和/api/transactions之类的服务时，我们就有两个前端服务：product.service.ts和transactions.service.ts。在这些服务中，我们具有与后端相同的功能。这些服务还将dto的响应映射到我们的前端模型接口。

当ewewer被多个模块使用（无论是服务还是组件都没有关系）时，我们将其放在shared / common目录中。