共计 1833 个字符，预计需要花费 5 分钟才能阅读完成。
分离是为了以后更好的相聚。- 匿名
1. 什么是前后端分离
在作者早期参加工作时，web 项目开发基本上是程序员加美工的组合，那个时候还没有明确的前后端的说法。一个 web 项目就像一道大杂烩，包括了界面和后端业务逻辑，同时前端的页面由后端进行渲染。
随着 Ajax，尤其是 nodejs 的发展，前端的能力大大增强，工程化也越来越成熟。很多之前需要后端去做的事情，比如页面的渲染，前端已经完全可以胜任。并且前端也不仅仅局限于 pc 桌面，而是发展到移动端，tv 等。近年来，前后端分离开发逐渐流行开来，尤其是在互联网方向，已经成为了主流的 web 开发方式。
2. 前后端分离的优点
2.1 优点一：分工明确
专业的人做专业的事情。前后端分离后，前端人员可以专注于 UI 界面的设计开发，后端人员则可以专注于业务逻辑开发，提供前端调用的 API 接口。
2.2 优点二：解除耦合
将前端 UI 界面和后端服务数据分离，可以将后端服务接口独立出来，服务于不同的前端 UI，比如传统 PC 桌面，移动端 H5，APP 等，提高了后端服务的可复用性和可维护性，同时也有利于向分布式微服务架构进行演变。
2.3 优点三：提升效率
前后端未分离 web 开发模式如下图：
我们可以看到，程序员要等待美工先导出 html 模板后，再开始整合模板，渲染页面。程序员承担了大部分的工作，包括页面的二次处理（数据渲染、页面整合等）以及后端业务逻辑的开发工作。
前后端人员可以同时进行开发，互不干扰。双方遵循统一的规范（产品原型及 API 接口文档），各自进行独立的开发，开发完成后进行联合测试（俗称联调）。
3. 前后端分离后产生的主要问题
3.1 沟通成本上升
前后端分离前，程序员承担了大部分前端页面渲染和后端业务逻辑的工作，基本上没有太多的沟通成本。前后端分离后，前端需要承担页面设计和数据渲染的工作，数据需要通过调用后端提供的接口服务来获取。这样一来，统一的接口文档就成为前端和后端的主要契约，随着需求的调整以及项目的快速迭代，接口也会随之出现变动，这时双方之间的沟通成本将大大增加。如果没有良好的沟通机制和统一的接口文档管理将会导致双方扯皮，互相推诿，影响产品周期和团队建设。
那么如何解决这个问题呢？简单来说就是：统一规范！也就是统一沟通机制以及接口文档管理。主要有以下几点建议：
接口文档由前后端中的一方进行统一管理。另外一方必须根据接口文档开展相应的工作。
至于是由前端去管理还是后端去管理，可以综合团队前后端人员的能力、业务理解程度等方面情况来决定。
对接口文档的变更操作，必须要先体现在接口文档中，并通知到相应人员。切记不要事后再去更改文档！
定期会议沟通，可集合团队具体的沟通机制进行。
使用接口文档管理系统，对接口进行统一的管理。同时很多接口文档管理系统还会提供接口版本管理、mock server，接口测试等功能。
推荐使用 YAPI 接口管理系统，可以为开发、产品、测试人员提供更优雅的接口管理服务。具体使用详见其官网。
3.2 前端模拟后端接口问题
前端需要有一个能够模拟接口及其数据的服务，这样前端的开发进度就不依赖于后端的开发进度，双方就可以根据统一的接口文档各自开展工作，而统一的 mock server 就比不可少了。上面推荐的 YAPI 接口管理系统，就可以提供相应的 mock 功能。
这里需要注意一个问题，那就是 mock server 很难完全覆盖到后端所有的接口业务逻辑。这也是为什么需要联调的原因。毕竟 mock 的环境与真实的环境还是存在一定的差异。不过只要根据规范来做，可以大大提高联调的效率，节省时间。
3.3 测试介入太晚，拉长产品周期
针对这个问题，作者的经验是只要接口文档确定好，测试就可以根据接口文档写对于的接口测试用例了，同时还可以和一些接口测试自动化工具结合在一起，而不必等到联调完成后才介入。
总的来说，在互联网、移动互联网等大部分 web 相关方面，可以优先考虑采用前后端分离的方式进行 web 项目的开发。当然，没有任何的技术、框架或者方案是银弹，能够一招走天下，我们需要综合考虑项目、团队、成本等多方面因素，采用合适的方案。
4. 小结
本节主要介绍了前后端分离的基本概念、优点、实践中存在的问题以及对应的解决思路和建议。从下一节开始，我们将结合实际的案例开始一步一步的实战探索 web 后端接口开发的过程及其细节。
本文为作者原创作品，属于《重新学习 web 后端开发》专辑中的一篇，转载时请备注作者信息及来源。本文原文地址：https://www.donnyzhang.com/20…
