利用Node.js开发前后端分离的系统——以图书馆地方文献系统为例

刘红卫

(泰达图书馆档案馆 天津 300457)

0 引 言

如今移动互联网高速发展，多种终端访问对Web应用开发提出了更高的要求。用户需求不断变化，Web应用能够自适应不同类型终端，不再单纯满足传统浏览器端的体验。用户需求的变化提高了Web开发难度，而针对不同终端开发不同版本应用的解决方法，并不是有效的开发方式，不仅需要额外的开发人员，还会带来成本增加、开发时间拖长等影响[1]。前后端分离是多终端 Web应用开发的可行方案，将后端保持不变，前端根据用户的需求和体验要求进行多终端定制开发，这样只需要改变前端代码，后端保持不变或微调，即可满足用户多终端需求，节省开发时间，降低开发成本，提高开发效率。

综上所述，Web应用开发的前后端分离模式是大势所趋。

1 图书馆地方文献系统概况

传承历史文明，服务现代化的物质文明和精神文明建设，搜集、整理和保存地方文献，历来都是公共图书馆的基本任务之一[2]。地方文献具有鲜明的区域性和实用性特点，在公共图书馆评估工作中，对地方文献的馆藏建设、开发利用都提出了相关要求，并占有较高分值。

笔者所在的图书馆在几年前建立了地方文献系统，并将拥有版权许可的文献进行数字化，读者可以在线检索、阅读，获得地方文献排架信息，文献类型包括书、报、刊、照片、图片以及音视频等。该系统是由第三方开发，运行在 Windows Server系统下采用Asp.net开发，已运行多年，现在经常出现系统死机状态，需要重启服务器才能恢复服务，读者意见很大。由于该系统是早期产品，厂商不再提供支持，当时的开发人员已经跳槽，现在无人能解决这个问题。

为了彻底解决系统中存在的上述问题，我们仔细研究了软件目录和结构，确定地方文献的对象数据文件存于一定规则的目录中，并且保存完整，元数据保存在 KBase数据库中，可以导出文本文件。于是，决定自行开发一套新的地方文献系统，既能实现旧系统的所有功能，又能实现响应式设计在多终端上使用。考虑到用户将来对多终端界面需求的变化以及开发人员少的现状，新系统的开发模式决定采用前后端分离模式。

2 前后端分离系统开发实践

2.1 前后端分离系统设计

2.1.1 软件开发平台的选择

Node.js基于 Chrome V8引擎的 JavaScript运行，使用高效、轻量级的事件驱动、非阻塞 I/O模型，它的包生态系统 npm是目前世界上最大的开源库生态系统[3]。Node.js使JavaScript不仅可以应用在浏览器端，也可以运行在服务器端。目前，Node.js凭借其优秀的性能受到全球各大公司的重视，如 eBay、Microsoft、PayPal、Uber、Yahoo 等，国内阿里巴巴、百度、腾讯等也在很多项目中应用，可见 Node.js的发展已经成熟，它能快速创建大规模的网络应用，处理高吞吐量的实时连接。Node.js有 Windows、Linux、macOS、SunOS、AIX 等系统平台版本，具有良好的跨平台可移植性，可以在Windows上开发，然后部署到Linux等其他系统上。

图书馆能承担系统开发的人员很少，平日开发工作基本局限于页面程序的改写和功能提升上，大家都对 JavaScript脚本语言比较熟悉。针对此情况，结合Node.js可用于全栈开发及诸多特性和优点，在前后端分离系统的开发管理方面也比较方便，为此选择了Node.js为软件开发平台。

2.1.2 前后端分离系统设计

如图1所示，在地方文献系统前后端分离架构设计中，前后端分别运行在不同的Node.js创建的Web Server上，前端负责接收用户的请求、相关验证和数据展示效果，后端负责按照约定好的 API请求处理业务逻辑、访问数据库、处理数据，并按约定的数据格式向前端返回相关数据(JSON格式)，包括请求API的时候进行相关验证。前后端之间通过HTTP请求进行交互，前端获取数据后，对页面进行组装和渲染，并将最终生成的页面返回浏览器。

图1 图书馆地方文献系统前后端分离架构图Fig.1 Back-and-rear separation architecture of the local library documentation system

其前端采用 MVVM(Model-View-View Model)模式，它是在 MVC(Model-View-Controller)模式基础上改进的开发模式，它与MVC模式相同的是把视图和数据分离，不同的是引入 ViewModel替换掉Controller来完成视图和数据的双向绑定，通过自动的方式完成大部分数据处理工作，从而降低了前端开发的复杂度。

2.2 API接口规范定义

在进行前后端分别开发之前，需要商定好前后端交互所需的 API，包括通讯接口、验证策略以及数据格式等，形成文档，确定文档版本号。前后端开发人员要共同遵守此文档，需要修改时要共同确认，变更文档和文档版本号，然后按照文档中的接口规范进行前后端的并行开发。

地方文献系统的前后端通讯是通过 HTTP请求作为API接口，这些API当然可以随意制定，只要前后端开发人员达成一致即可。但随意的 API形式缺乏合理性，可读性差存在较多隐患。因此，我们采用目前较为流行的RESTful制定了API接口。

REST(Representational State Transfer)描述了一个架构样式的网络系统，比如 Web应用程序。在目前主流的 3种 Web服务交互方案中，REST相比于SOAP和 XML-RPC更加简单明了，无论是对 URL的处理还是对 Payload的编码，REST都倾向于用更加简单轻量的方法设计和实现。值得注意的是 REST并没有一个明确的标准，而更像是一种设计风格。每个资源都使用 URI(Universal Resource Identifier)得到一个唯一的地址，所有资源都共享统一的接口，以便在客户端和服务器之间传输状态，使用的是标准的HTTP 方法，比如 GET、PUT、POST 和 DELETE[4]。符合这种风格的 Web应用则称为 RESTful。使用RESTful制定的API很容易理解，可避免产生歧义。

2.3 前后端分离的实现

2.3.1 前端的实现

前端页面采用目前流行框架 Vue.js，它是基于MVVM 模式的轻量级响应式框架，它能有效简化Web前端开发流程。Vue.js与其他重量级框架不同之处是，它是一套构建用户界面的渐进式框架，采用自底向上增量开发的设计方式，是更加灵活、开放的解决方案，架构更加简单，适合开发人员快速掌握其全部特性并投入使用，还便于与第三方库或既有项目整合[5]。

Vue.js体量轻盈、性能优异、路由功能强大，而且易用、灵活、高效，在 npmjs.com 上有 vue.js脚手架工具vue-cli，通过vue-cli能直接生成Node.js环境下的 Vue应用程序框架，减少构建时间。另外 vue.js现在应用广泛，网络交流社区很多，使用中如遇到任何问题都可以利用这些资源及时找到解决办法，保证开发工作的顺利进行。

为了适应多终端用户浏览器环境，页面采用响应式布局设计，根据终端环境的不同，自动适应屏幕大小，优化页面显示。响应式布局框架有很多，比较流行的是 bootstrip.js，图书馆的开发人员在以前的项目中也曾使用过，使用 npm 可以轻松地将 bootstrap.js加入到开发环境中，然后用 import语句将 bootstrap及相关 css文件引入到程序文件中，bootstrap和 vue整合使用效果非常好。

前端的Web Server是由vue-cli工具生成vue开发框架中所包含的，它实际是一个 express框架。前端向后端请求 HTTP API异步操作时会出现跨越问题，可以通过在前端 Web server程序中引入 httpproxy-middleware中间件来解决。

前端程序通过 mock.js按照约定的接口文档生成模拟数据进行单独测试，不用等后端 API接口开发完毕，这样能够在前后端的集成测试前发现大部分问题，从而节省集成测试的时间，缩短开发周期。

2.3.2 后端的实现

后端 Web Server采用 Koa2。Koa是由 Express原班人马打造的，致力于成为一个更小、更富有表现力、更健壮的 Web框架。使用 Koa编写 web应用，通过组合不同的generator，可以免除重复繁琐的回调函数嵌套，并极大地提升错误处理的效率。Koa不在内核方法中绑定任何中间件，它仅仅提供了一个轻量优雅的函数库，使得编写Web应用变得得心应手[6]。Koa2是一个简单的MVC架构，结构非常清晰，地方文献系统的数据库采用mysql，通过npm将mysql访问包文件加入到后台开发环境中，将数据处理程序如mysql数据库的操作、本地文件访问等程序放到models目录，将业务逻辑处理程序放到controllers目录，另外将API接口定义在router目录中api.js文件内，该文件要引入 koa-router包，在主程序中通过语句app.use(require('./server/routes/ api.js').routes())启动API接口路由。

Koa2中Koa Context将node的request和response对象封装到单个对象中，为编写 Web应用程序和API提供了许多有用的方法。比如用ctx标识符创建一个 Context，使用语句 ctx.body＝result_set，这里的result_set是指API接口处理程序的结果数据集，这样前端就获得了后端返回的数据。

应用Koa2开发是非常简单、快捷、清晰的，要实现 Koa功能扩展既可以自己编写中间件程序，也可在 npmjs.com网站上找那些优秀的支持 Koa2的中间件直接使用，提高开发效率。但是，网上的中间件良莠不齐，需要仔细甄别。

2.4 部署

前后端分离的地方文献系统集成测试完毕后，可以部署到一台或多台服务器，前后端分开以及数据库独立，可根据业务运行的实际情况按需部署，应用非常灵活。

目前，图书馆的地方文献系统前后端和数据库暂时部署在一台 Windows Server上，从运行的效果看已经满足读者的访问要求。这得益于部署时使用了Node.js的高级生产进程管理工具PM2。

Node.js以单线程的方式运行，多核心处理器系统不能发挥最大的性能。Node.js提供了 cluster模块，可以生成多个工作线程，只需要将代码封装到cluster的处理逻辑中，再增加额外的代码用于解决一个线程挂掉的问题。PM2内置 cluster模式包含了所有上述的处理逻辑，不必修改任何代码，轻松地实现负载均衡，并能实时进行扩展。

PM2简化了很多 Node.js应用管理中的繁琐任务，不论什么情况都能保持生产进程一直运行，生产环境实现零停机更新。它还提供了性能监控、自动重启、控制台检测、远程控制接口API等功能，目前PM2支持在Linux、macOS、Windows等多平台运行。

3 前后端分离的优势

通过 Node.js进行前后端分离的地方文献系统开发的优势为：首先，前后端开发人员的职责完全分清，能够同时并行开发和测试，互不干扰，提高了开发效率，缩短了开发时间，降低了项目成本；其次，前端界面变化后端无需修改，可以轻松应对今后多终端需求的改变，降低了维护成本；最后，提高了代码的可复用性和可维护性，架构明确，代码清晰。

4 结 语

利用Node.js开发前后端分离的图书馆地方文献系统的实践，不仅仅是前后端开发的分工，也是开发环境、代码、部署的完全分离，与传统的 Web应用开发模式相比，提高了开发效率，增强了代码的可维护性，提高了系统的可用性、伸缩性、扩展性。今后还应在接口服务化、代码模块化、功能组件化等方面进一步探索，以便应对越来越复杂的 Web应用开发挑战。