一 傳統(tǒng)的開發(fā)模式

前后端分離前我們的開發(fā)協(xié)作模式一般是這樣的：

前端寫好靜態(tài)的HTML頁面交付給后端開發(fā)。靜態(tài)頁面可以本地開發(fā)，也無需考慮業(yè)務(wù)邏輯只需要實現(xiàn)View即可。

后端使用模板引擎去套模板，同時內(nèi)嵌一些后端提供的模板變量和一些邏輯操作。

然后前后端集成對接，遇到問題，前臺返工，后臺返工。

然后在集成，直至集成成功。

這種模式的問題

在前端調(diào)試的時候要安裝完整的一套后端開發(fā)工具，要把后端程序完全啟動起來。遇到問題需要后端開發(fā)來幫忙調(diào)試。我們發(fā)現(xiàn)前后端嚴(yán)重耦合，還要要求后端人員會一些HTML，JS等前端語言。前端頁面里還嵌入了很多后端的代碼。一旦后端換了一種語言開發(fā)，簡直就要重做。

像這種增加了大量的溝通成本，調(diào)試成本等，而且前后端的開發(fā)進度相互影響，從而大大降低了開發(fā)效率。

二 前后端分離的開發(fā)模式

前后端分離并不只是開發(fā)模式，而是web應(yīng)用的一種架構(gòu)模式。在開發(fā)階段，前后端工程師約定好數(shù)據(jù)交互接口，實現(xiàn)并行開發(fā)和測試；在運行階段前后端分離模式需要對web應(yīng)用進行分離部署，前后端之前使用HTTP或者其他協(xié)議進行交互請求。

1. 客戶端和服務(wù)端采用RESTFul API的交互方式進行交互

2. 前后端代碼庫分離

在傳統(tǒng)架構(gòu)模式中，前后端代碼存放于同一個代碼庫中，甚至是同一工程目錄下。頁面中還夾雜著后端代碼。前后端工程師進行開發(fā)時，都必須把整個項目導(dǎo)入到開發(fā)工具中。

前后端代碼庫分離，前端代碼中有可以進行Mock測試(通過構(gòu)造虛擬測試對 象以簡化測試環(huán)境的方法)的偽后端，能支持前端的獨立開發(fā)和測試。而后端代碼中除了功能實現(xiàn)外，還有著詳細的測試用例，以保證API的可用性，降低集成風(fēng)險。

3. 并行開發(fā)

在開發(fā)期間前后端共同商定好數(shù)據(jù)接口的交互形式和數(shù)據(jù)格式。然后實現(xiàn)前后端的并行開發(fā)，其中前端工程師在開發(fā)完成之后可以獨自進行mock測試，而后端也可以使用Postman等接口測試軟件進行接口自測，然后前后端一起進行功能聯(lián)調(diào)并校驗格式，最終進行自動化測試。

分離后，開發(fā)模式是這樣的

三 前后分離的優(yōu)點

為優(yōu)質(zhì)產(chǎn)品打造精益團隊

通過將開發(fā)團隊前后端分離化，讓前后端工程師只需要專注于前端或后端的開發(fā)工作，是的前后端工程師實現(xiàn)自治，培養(yǎng)其獨特的技術(shù)特性，然后構(gòu)建出一個全棧式的精益開發(fā)團隊。

提升開發(fā)效率

前后端分離以后，可以實現(xiàn)前后端代碼的解耦，只要前后端溝通約定好應(yīng)用所需接口以及接口參數(shù)，便可以開始并行開發(fā)，無需等待對方的開發(fā)工作結(jié)束。與此同時，即使需求發(fā)生變更，只要接口與數(shù)據(jù)格式不變，后端開發(fā)人員就不需要修改代碼，只要前端進行變動即可。如此一來整個應(yīng)用的開發(fā)效率必然會有質(zhì)的提升。

完美應(yīng)對復(fù)雜多變的前端需求

如果開發(fā)團隊能完成前后端分離的轉(zhuǎn)型，打造優(yōu)秀的前后端團隊，開發(fā)獨立化，讓開發(fā)人員做到專注專精，開發(fā)能力必然會有所提升，能夠完美應(yīng)對各種復(fù)雜多變的前端需求。

增強代碼可維護性

前后端分離后，應(yīng)用的代碼不再是前后端混合，只有在運行期才會有調(diào)用依賴關(guān)系。應(yīng)用代碼將會變得整潔清晰，不論是代碼閱讀還是代碼維護都會比以前輕松。

總結(jié)

以上是生活随笔為你收集整理的前后端分离开发模式 总结的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。