最近我接手了一个前端项目，这个项目需要与后台进行数据交互，而后台提供了一套 RESTful API。为了更方便地调用这些 API，我决定使用一个 npm 包来生成对应的 Angular 客户端。经过一番搜索和尝试，我找到了 endpoints-angular-client-generator 这个 npm 包，现在我来和大家分享一下使用它的方法。
简介
Endpoints 是 Google Cloud Platform 上的一个服务，它可以让开发者用一种声明式的方式定义 API，并生成这个 API 的客户端代码。这个客户端代码生成器支持多种语言和框架，包括 Angular、React、Vue 等。
endpoints-angular-client-generator 它是针对 Angular 框架的生成器，可以帮助我们快速生成与 endpoints 接口交互的 Angular 客户端代码。
安装
使用 npm 可以很方便地安装 endpoints-angular-client-generator：
npm install endpoints-angular-client-generator --save-dev
使用方法
1. 定义 endpoints API
首先，我们需要在 Endpoints Console 中定义 API，并生成 API 的客户端库。这一步需要我们自己在 Google Cloud Platform 上进行操作。详细的步骤可以参考官方文档。
假设我们的 API 定义文件为 api.yaml，生成的客户端库文件为 api-client.zip。
2. 解压并复制客户端库
我们需要将 api-client.zip 解压并复制到项目中，可以放在 src/assets 目录下(如果该目录不存在就手动建立一个)。
3. 生成客户端代码
在项目中使用 endpoints-angular-client-generator，我们需要在 package.json 中添加一条脚本：
"scripts": {
"generate:api-client": "google-apis-client-generator generate -l javascript --input=src/assets/api.yaml --output=src/app/api-client"
}这个脚本将会在 src/app/api-client 目录下生成客户端代码。
4. 编写服务
在 Angular 应用中，我们习惯使用服务的方式来封装 API 调用。接下来，我们以一个使用 get 方法获取用户信息的例子来演示如何使用生成的客户端。
-- -------------------- ---- -------
------ - ---------- - ---- ----------------
------ - ----- -------- - ---- ----------------
------ - ------ - ---- ---------------------------------
------ - -------------- ---------- -------------- ------------ ---------- ------ - ---- -----------------------------------------------
------ - ---------- - ---- ------------------
------ ------------------------
------ ----------------------------------
-------------
------ ----- ------------- -
------------------- ----- ----- - -
------------- -------- ------------------ -
----- ------ - --- ---------
----- --------- - --- ------------------
----- -------- --------------------- - -
----- -------------------
------- ------------------------
-
----- ------- - ------------------------------
------ --------------------------------
-
-我们首先导入生成的客户端，之后使用它来构造请求。在这个例子中，我们使用 people.get 方法来获取某个用户的基本信息。
结语
在学习和使用 endpoints-angular-client-generator 的过程中，我发现它确实可以帮助我们更方便地与 endpoints 接口交互。使用这个工具，我们可以将接口封装成服务，然后在组件中调用服务的方法来获取数据。这样可以更好地解耦组件和接口的关系，使得我们的代码变得更加整洁和易于维护。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066e25a563576b7b1ece8f