分離是為了以后更好的相聚辨绊。- 匿名
1. 什么是前后端分離
在作者早期參加工作時(shí)匹表，web項(xiàng)目開發(fā)基本上是程序員加美工的組合门坷，那個時(shí)候還沒有明確的前后端的說法宣鄙。一個web項(xiàng)目就像一道大雜燴默蚌，包括了界面和后端業(yè)務(wù)邏輯冻晤，同時(shí)前端的頁面由后端進(jìn)行渲染绸吸。
隨著Ajax鼻弧，尤其是nodejs的發(fā)展，前端的能力大大增強(qiáng)攘轩，工程化也越來越成熟。很多之前需要后端去做的事情码俩，比如頁面的渲染度帮，前端已經(jīng)完全可以勝任稿存。并且前端也不僅僅局限于pc桌面笨篷，而是發(fā)展到移動端瓣履，tv等率翅。近年來，前后端分離開發(fā)逐漸流行開來冕臭，尤其是在互聯(lián)網(wǎng)方向，已經(jīng)成為了主流的web開發(fā)方式瓢棒。
2. 前后端分離的優(yōu)點(diǎn)
2.1 優(yōu)點(diǎn)一：分工明確
專業(yè)的人做專業(yè)的事情。前后端分離后脯宿，前端人員可以專注于UI界面的設(shè)計(jì)開發(fā)念颈，后端人員則可以專注于業(yè)務(wù)邏輯開發(fā)连霉，提供前端調(diào)用的API接口榴芳。
2.2 優(yōu)點(diǎn)二：解除耦合
將前端UI界面和后端服務(wù)數(shù)據(jù)分離，可以將后端服務(wù)接口獨(dú)立出來跺撼，服務(wù)于不同的前端UI，比如傳統(tǒng)PC桌面歉井，移動端H5柿祈，APP等，提高了后端服務(wù)的可復(fù)用性和可維護(hù)性躏嚎，同時(shí)也有利于向分布式微服務(wù)架構(gòu)進(jìn)行演變蜜自。
2.3 優(yōu)點(diǎn)三：提升效率
前后端未分離web開發(fā)模式如下圖：
我們可以看到卢佣，程序員要等待美工先導(dǎo)出html模板后重荠，再開始整合模板虚茶，渲染頁面戈鲁。程序員承擔(dān)了大部分的工作，包括頁面的二次處理（數(shù)據(jù)渲染婆殿、頁面整合等）以及后端業(yè)務(wù)邏輯的開發(fā)工作。
前后端人員可以同時(shí)進(jìn)行開發(fā)，互不干擾。雙方遵循統(tǒng)一的規(guī)范（產(chǎn)品原型及API接口文檔）怨愤，各自進(jìn)行獨(dú)立的開發(fā)，開發(fā)完成后進(jìn)行聯(lián)合測試（俗稱聯(lián)調(diào)）癌压。
3. 前后端分離后產(chǎn)生的主要問題
3.1 溝通成本上升
前后端分離前，程序員承擔(dān)了大部分前端頁面渲染和后端業(yè)務(wù)邏輯的工作滩届，基本上沒有太多的溝通成本集侯。前后端分離后，前端需要承擔(dān)頁面設(shè)計(jì)和數(shù)據(jù)渲染的工作棠枉，數(shù)據(jù)需要通過調(diào)用后端提供的接口服務(wù)來獲取。這樣一來泡挺，統(tǒng)一的接口文檔就成為前端和后端的主要契約辈讶，隨著需求的調(diào)整以及項(xiàng)目的快速迭代娄猫，接口也會隨之出現(xiàn)變動贱除，這時(shí)雙方之間的溝通成本將大大增加媳溺。如果沒有良好的溝通機(jī)制和統(tǒng)一的接口文檔管理將會導(dǎo)致雙方扯皮月幌，互相推諉，影響產(chǎn)品周期和團(tuán)隊(duì)建設(shè)悬蔽。
那么如何解決這個問題呢？簡單來說就是：統(tǒng)一規(guī)范！也就是統(tǒng)一溝通機(jī)制以及接口文檔管理录语。主要有以下幾點(diǎn)建議：
-
接口文檔由前后端中的一方進(jìn)行統(tǒng)一管理。另外一方必須根據(jù)接口文檔開展相應(yīng)的工作钦无。
至于是由前端去管理還是后端去管理逗栽，可以綜合團(tuán)隊(duì)前后端人員的能力、業(yè)務(wù)理解程度等方面情況來決定彼宠。
對接口文檔的變更操作，必須要先體現(xiàn)在接口文檔中弟塞，并通知到相應(yīng)人員凭峡。切記不要事后再去更改文檔决记！
定期會議溝通摧冀，可集合團(tuán)隊(duì)具體的溝通機(jī)制進(jìn)行系宫。
-
使用接口文檔管理系統(tǒng)索昂，對接口進(jìn)行統(tǒng)一的管理。同時(shí)很多接口文檔管理系統(tǒng)還會提供接口版本管理扩借、mock server，接口測試等功能潮罪。
推薦使用YAPI接口管理系統(tǒng)康谆，可以為開發(fā)嫉到、產(chǎn)品沃暗、測試人員提供更優(yōu)雅的接口管理服務(wù)。具體使用詳見其官網(wǎng)孽锥。
3.2 前端模擬后端接口問題
前端需要有一個能夠模擬接口及其數(shù)據(jù)的服務(wù)，這樣前端的開發(fā)進(jìn)度就不依賴于后端的開發(fā)進(jìn)度导而，雙方就可以根據(jù)統(tǒng)一的接口文檔各自開展工作忱叭，而統(tǒng)一的mock server就比不可少了今艺。上面推薦的YAPI接口管理系統(tǒng)韵丑，就可以提供相應(yīng)的mock功能。
這里需要注意一個問題撵彻，那就是mock server很難完全覆蓋到后端所有的接口業(yè)務(wù)邏輯钓株。這也是為什么需要聯(lián)調(diào)的原因。畢竟mock的環(huán)境與真實(shí)的環(huán)境還是存在一定的差異轴合。不過只要根據(jù)規(guī)范來做，可以大大提高聯(lián)調(diào)的效率碗短，節(jié)省時(shí)間受葛。
3.3 測試介入太晚偎谁，拉長產(chǎn)品周期
針對這個問題总滩，作者的經(jīng)驗(yàn)是只要接口文檔確定好巡雨，測試就可以根據(jù)接口文檔寫對于的接口測試用例了闰渔，同時(shí)還可以和一些接口測試自動化工具結(jié)合在一起，而不必等到聯(lián)調(diào)完成后才介入铐望。
總的來說，在互聯(lián)網(wǎng)正蛙、移動互聯(lián)網(wǎng)等大部分web相關(guān)方面督弓，可以優(yōu)先考慮采用前后端分離的方式進(jìn)行web項(xiàng)目的開發(fā)乒验。當(dāng)然咽筋，沒有任何的技術(shù)、框架或者方案是銀彈，能夠一招走天下蒜危，我們需要綜合考慮項(xiàng)目虱痕、團(tuán)隊(duì)、成本等多方面因素部翘，采用合適的方案。
4. 小結(jié)
本節(jié)主要介紹了前后端分離的基本概念响委、優(yōu)點(diǎn)、實(shí)踐中存在的問題以及對應(yīng)的解決思路和建議赘风。從下一節(jié)開始夹囚，我們將結(jié)合實(shí)際的案例開始一步一步的實(shí)戰(zhàn)探索web后端接口開發(fā)的過程及其細(xì)節(jié)。
