在现代 Web 应用中，随着前端架构的复杂性不断增加，后端开发和前端开发的分工也越来越明显。传统的前后端分离架构，需要前端和后端同时开发和维护，并且还需要进行跨域请求和接口封装，难度较大。
为解决这一问题，有一种新的架构方式被广泛应用，这就是「BFF (Backend For Frontend)」模式，它借鉴了微服务架构中 API Gateway 的思想，将后端接口按照前端组件的需求进行封装，提供给前端开发人员直接调用，降低前后端协作的成本，提高开发效率。
在 BFF 架构中，最核心的部分就是 BFF 层。而在 Node.js 世界里，有个 npm 包叫做 bffs，它正是为 BFF 架构而生。在本文中，我们将着重介绍 bffs 包的使用方法。
BFFs 包简介
WalmartLabs 的开发团队在应对自己的 BFF 架构的挑战时，创作了 bffs 这个库。它主要功能是在 Node.js 中快速创建基于 JSON 格式的 RESTful API，并且能够根据需要在前端和后端之间调整层次结构。
bffs 主要特点包括：
- 支持全局插件并提供插件 API。
- 支持 before/after Middleware。
- 可以兼顾本地/非本地 API。
- 可以进行递归请求。
- 小巧高效。
如果想要详细了解 bffs 的使用方法，接下来的章节将会讲到。
BFFs 包的安装
在开始使用 bffs 的同时，你需要先安装 Node.js，并通过 npm 初始化你的项目。在终端中运行以下命令完成安装：
--- ------- ---- ------
这个命令使用了 npm 进行安装，并将 bffs 加入到你的项目依赖中。
BFFs 包的使用
在你的 Node.js 项目中引入 bffs 包，并使用它提供的 API，可以快速创建 RESTful API 并将其连接到你的应用程序。
----- ---- - ----------------
----- --- - ------
----- -----------
---
-----------------------------
------------ -------- ----- ---- -- -
--------------- --------
---
----------------以上这段代码，创建了一个简单的示例，当你在浏览器中打开 http://localhost:3000/hello 时，可以看到返回的字符串 hello world。但是你应该意识到，这不是一个真正的 BFF API。接下来我们将详细介绍，如何让上述代码完成 BFF 的功能。
BFFs 包的实现
为了更好地理解 bffs 的工作原理，我们先来简单介绍下 BFF 架构本身。
BFF 是一种后端架构，它解决的是由于新的前端设置引起的原有接口无法支持的问题。具体而言，由于前端的不断迭代，可能会让已有的接口无法支持，比如一些需要调度的服务，接口形式会发生变化，如果只是通过前端调度的话，可能就需要重新编写代码。而 BFF 就是在下游服务之前建立一个业务层，专门面向前端业务进行数据调用，把接口的调用封装起来，实现弹性调度，从而避免由于接口变化带来的连锁变化调整。
BFF 的设计理念，就是要将后端接口按照前端组件的需求进行组合和封装，这样能够减少前端和后端的耦合度。可能你对这个解释有些困惑，所以我们现在来针对这个问题进行深度讲解。
BFF 的设计原则
在了解 BFF 的设计原则前，我们先明确一下需求点。
首先，我们要解决的是技术层面的问题。由于前端项目的快速发展，前端、后端的产品经理在获取业务后如果需要联系后端同学，其中需要沟通的问题可能涉及到：获取接口列表、参数说明、数据格式等等。如此复杂的拉取工作，对双方都是相当大的负担。
其次，这个问题将破坏团队的开发节奏和效率。在前端和后端团队中，需要通过跨域请求和接口封装调用外部接口服务，这会阻碍团队的合作和敏捷项目开发。
另外，前端团队还需要在接收到的数据中进行统计和过滤，以使它适合客户端的显示。
基于上述问题，我们可以得出一些 BFF 的设计原则：
- 根据前端的需要提供简单的 API 接口，避免前端和后端耦合。
- BFF 层应该可配置、可扩展，以满足不同项目的需求。
- BFF 负责调用微服务，有助于解锁前端团队所擅长的技能。
- BFF 要具备下层调用链路的灵活性，从而可以快速变化，适应需求变化。
接下来，我们将着手介绍 BFFs 包，在不同情况下如何执行 BFF 架构。
BFFs 包的使用方法
第一步：创建出一个名为 myBFF_API 的变量：
----- --------- - ------
----- -----------
---第二步：使用 BFFs 内置插件
在创建 API 之前，你也许还需要先配置下 BFFs 的内置插件，插件有：用于解析请求体的插件，用于确定请求类型的插件等。你需要在你的代码库中先安装这些插件：
--- ------- ----------- ------- ---- -----
之后在 BFFs 中引入他们：
----------------------------------- -------------------------------- ----------------------------- ------------------------------
尝试使用上述插件
第三步：创建 BFF 路由
---------------
------- ------
----- -------------
-------- ------------- ---- -
---------------
----- ---------- --------- - ----------
--------------
------------ -- ---------- -
---------------------- ------ ---------- ---
-------
-
------
---------------------------- ------------------------
-
---将 token 返回给前端。注意，上面的代码仅表示我们只针对/login 的路径保持了一个 GET 路线。
第四步：启动 BFFs API 服务器
----------------------
使用上面的代码，你的服务器运行在你的项目在 3000 端口上。
例子说明
这样，我们就已经建立了一个简单 BFF API。它仅仅是作为一个代理响应了一个固定的请求和返回结果。
我希望，经过这篇教程，你对 BFFs 的使用和实现有了更好的了解，在你下一个三分之二的 Web 项目中，你会尽可能地使用它！
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/67713