前后端分离开发思路,用Node作为中间件

前言

随着公司技术革新，Node.js逐渐应用在新技术体系中，从2009年发布至今Node.js逐渐成熟和日趋稳定。一般的做法都是将原本属于后端的一部分相对于业务不是很重要的功能迁移到Node.js上面来，也有一些公司将Node.js作为前后端分离的一个解决方案去施行。国内最早淘宝网完成了前后端分离，也提供了一个很大的开发导向。
前端分离之前生今世
在最初的web开发中，行业主要将浏览器作为前后端的分界线，将浏览器中为用户进行页面展示的部分称之为前端，而将运行在服务器，为前端提供业务逻辑和数据准备的所有代码统称为后端。
由于前后端分离这个概念相对比较年轻，很多程序猿都是只闻其声，不见其形，所以可能对它产生一些误解，误以为前后端只是一种web开发模式，只是在web开发期进行了前后端开发工作的分工就是前后端分离。
前后端分离不只是开发模式，而是web开发的一种架构模式。在开发阶段，前后端工程师约定好数据交互接口，实现并行开发和测试。在运行阶段前后端分离模式需要对web应用进行分离部署，前后端之前使用HTTP或者其他协议进行交互请求。然而作为一种架构模式，我们在实施的过程中主要对以下四个方面来进行比较和重新认识。
前后端分离大概可以从四个方面来理解：

1. 交互形式
2. 代码组织方式
3. 开发模式
4. 数据接口规范流程

一、交互形式

在前后端分离架构中，后端只需要负责按照约定的数据格式向前端提供可调用的API服务即可。前后端之间通过HTTP请求进行交互，前端获取到数据后，进行页面的组装和渲染，最终返回给浏览器。

二、代码组织方式

在传统架构模式中，前后端代码存放于同一个代码库中，甚至是同一工程目录下。页面中还夹杂着后端代码。前后端工程师进行开发时，都必须把整个项目导入到开发工具中。
而前后端分离模式在代码组织形式上有以下两种:
(1) 半分离
前后端共用一个代码库，但是代码分别存放在两个工程中。后端不关心或很少 关心前端元素的输出情况，前端不能独立进行开发和测试，项目中缺乏前后端 交互的测试用例。
(2)分离
前后端代码库分离，前端代码中有可以进行Mock测试(通过构造虚拟测试对象以简化测试环境的方法)的伪后端，能支持前端的独立开发和测试。而后端代码中除了功能实现外，还有着详细的测试用例，以保证API的可用性，降低集成风险。

三、开发模式

我们之前的架构属于传统的MVC架构，整体没有进行前后端分离，在项目的开发阶段，前端工程师负责编写HTML，完成前端的页面设计并套页面，然后再使用模板技术将写好的前端代码转换为Smarty脚本，同时内嵌一些后端提供的模板变量和一些逻辑操作。应用运行期，将全部代码进行打包，和后端代码部署到同一服务器上，同时会进行简单的动静态分离部署。
应用的开发流程:
提出需求 —> 前端开发页面 —> 翻译成模板 —> 前后端对接 —> 集成遇到问题 —> 前端返工 —> 后端返工 —> 二次集成 —> 集成成功 —> 交付上线
前后端分离之后，则变成如下流程：
提出需求 —> 设计接口约定数据 —> 前后端并行开发 —> 前后端集成 —> 前端调整页面 —> 集成成功 —> 交付上线

四、数据接口规范流程

在开发期间前后端共同商定好数据接口的交互形式和数据格式。然后实现前后端的并行开发，其中前端工程师再开发完成之后可以独自进行mock测试，而后端也可以使用接口测试平台进行接口自测，然后前后端一起进行功能联调并校验格式，最终进行自动化测试。

需要进行前后端分离的场景
任何一项技术以及架构都不是适用于任何场景，前后端分离同样也是如此。虽然前后端分离架构能带来许多的好处，但前提是建立在开发团队合适的基础上的。
试用场景：

1. 页面布局复杂，使用了主题和样式。
2. 需要有较高的页面渲染效果
3. 前端页面中包含复杂业务逻辑
4. 页面需要渲染的数据量较大

如何做到前后端分离

前端的技术框架是: vue全家桶 + Node.js + Express
首先，先分清楚前后端的工作:
前端的工作：实现整一个前端页面以及交互逻辑，以及利用ajax与nodejs服务器（中间层)交互。
后端的工作：提供API接口，利用redis来管理session,与数据库交互。

1. 一般来说，要实现前后端分离，前端就需要开启一个本地的服务器来运行自
   己的前端代码，以此来模拟真实的线上环境，并且，也是为了更好的开发。因为你在实际开发中，你不可能要求每一个前端都去搭建一个java(php)环境，并且在java环境下开发，这对于前端来说，学习成本太高了。但如果本地没有开启服务器的话，不仅无法模拟线上的环境，而且还面临到了跨域的问题，因为你如果写静态的html页面，直接在文件目录下打开的话，你是无法发出ajax请求的(浏览器跨域的限制),因此，你需要在本地运行一个服务器，可是又不想搭建陌生而庞大的java环境，怎么办法呢？nodejs正好解决了这个问题。在我们项目中，我们利用nodejs的express框架来开启一个本地的服务器，然后利用nodejs的一个http-proxy-middleware插件将客户端发往nodejs的请求转发给真正的服务器，让nodejs作为一个中间层。这样，前端就可以无忧无虑的开发了
2. 由于前后端分离后，前端和后台同时开发时，就可能遇到前端已经开发好一个页面了，可是却等待后台API接口的情况。比如说A是负责前端，B是负责后台 , A可能用了一周做好了基本的结构，并且需要API接口联调后，才能继续开发，而此时B却还没有实现好所需要的接口，这种情况，怎么办呢？在我们这个项目里，我们是通过了mock来提供一些假数据，我们先规定好了API接口，设计出了一套API文档，然后我们就可以通过API文档，利用mock(http://mockjs.com)来返回一些假数据，这样就可以模拟发送API到接受响应的整一个过程，因此前端也不需要依赖于后端开发了，可以独立开发，等到后台的API全部设计完之后，就可以比较快速的联调。

为什么要引入Node.js作为中间层?

在这个项目里，我们将Node.js作为中间层，那么，为什么我们要特地引入Node.js呢？直接用java做不就行了吗？
• 我觉得引入Node.js主要是为了分层开发，职责划分，Node.js作为前端服务器，由前端开发人员负责，前端开发人员不需要知道java后台是如何实现的，也不需要知道API接口是如何实现的，我们只需要关心我们前端的开发工作，并且管理好Node.js前端服务器，而后台开发人员也不需要考虑如何前端是如何部署的，他只需要做好自己擅长的部分，提供好API接口就可以；
• Node.js本身有着独特的异步、非阻塞I/O的特点，这也就意味着他特别适合I/O密集型操作，在处理并发量比较大的请求上能力比较强，因此，利用它来充当前端服务器，向客户端提供静态文件以及响应客户端的请求，我觉得这是一个很不错的选择。