1. 什么是MVC模式
MVC模式誕生于上世紀七八十年代,至今仍存在于很多應用之中,比如Java中的Struts、Spring MVC等架構。這是一種經典的設計模式,全名為Model-View-Controller,即模型-視圖-控制器。
(1) Model(模型)表示應用程序核心,表示企業數據和業務規則。
(2) View(視圖)顯示數據(數據庫記錄),視圖是用戶看到并與之交互的界面。
(3) Controller(控制器)處理輸入(寫入數據庫記錄),控制器接受用戶的輸入并調用模型和視圖去完成用戶的需求,它只是接收請求并決定調用哪個模型構件去處理請求,然后再確定用哪個視圖來顯示返回的數據。
使用MVC應用程序被分為三個核心部件:模型、視圖、控制器。它們各自處理自己的任務,最典型的MVC就是JSP+servlet+javabean的模式。
2. MVC模式的優點和缺點
MVC模式的誕生讓開發更高效,讓代碼耦合度盡量減少,讓應用更部分的職責更加清晰。
但是MVC框架也是有不足:
(1) 每次用戶的操作請求必須流程為:控制器-模型-視圖,用戶才能看到最終的界面;
(2) 視圖的呈現必須由模型來調研;
(3) 渲染視圖的過程在服務端來完成,最終呈現出來的是帶有模型的視圖頁面,性能無法得到很好的優化。
為了使數據展現過程更加直接,并且提供更好的用戶體驗,需要對MVC模式進行改進,首先從瀏覽器發送AJAX請求,然后服務端接受請求并返回JSON數據返回給瀏覽器,最后在瀏覽器端進行渲染,如圖:
如果將瀏覽器一端視為前端,而服務器一端視為后端的話,如圖所示:
則經過改進后的模型,我們可以使用REST實現,前端關注界面展現,后端關注業務邏輯,分工明確,職責清晰。
3. 什么是REST
REST:REpresentational State
Transfer = 直接翻譯:表現層狀態轉移。這是一個”無狀態”的架構模式,因為在任何時候都可以由客戶端發出請求到服務端,最終返回自己想要的數據,當前請求不會受到上次請求的影響。所以,REST也被人們看做是一種“輕量級”的SOA實現技術,因此在企業級應用與互聯網應用中都得到了廣泛應用。
現在我們展示一個關于前后端分離的REST示例方便理解:
比如一個用戶訪問餓了么的外賣網站,該網站對其所銷售的各個商家的店鋪或者商品進行詳細分類。當用戶登陸該餓了么外賣平臺后,他首先需要在餓了么外賣平臺選擇其所需要尋找的商家或者商品分類,進而列出屬于該分類的各個物品。
從業務邏輯的角度來說這個流程很簡單,但實際上瀏覽器向后臺發了多個請求:頁面邏輯加載時將首先得到所有的商品分類,并將這些分類顯示在頁面中。在用戶選擇了一個分類的時候,頁面邏輯將發送一個請求得到該分類的詳細信息,并發送一個請求來得到該分類的列表,而服務器將返回所有的類別。
二.前后端分離的好處是什么
如果沒有前后端分離,則隨著業務的拓展,前端代碼越來越復雜,如:
(1) 無法統一協作模式,代碼充滿了約定;
(2) JS跟CSS,依賴于厚度按產出的HTML;
(3) 有的數據來自AJXA,有的數據印在DOM上;
(4) 有的業務邏輯在前端,有的在model層,更多的是在view層。
其次前后端依舊高度耦合:
(1) 前端依賴服務端開發環境;
(2) 在服務端View層高度耦合;
(3) 溝通成本很高;
(4) 職責不清晰。
還有無法良好的支持跨終端
(1) 業務邏輯散落在應用中;
(2) 渲染邏輯強依賴后端頁面;
(3) 只能用responsive design硬來。
最終高度耦合的前后端分工:
(1) 溝通成本上升;
(2) 維護成本上升;
(3) 無法正確的快速響應變化;
(4) 代碼的腐敗只是遲早的問題。
而前后端分離之后:
(1) 后端只提供數據,處理業務邏輯,代碼跑在服務器上;
(2) 前端接收數據,返回數據,處理渲染邏輯,代碼跑在瀏覽器上。
這樣分工明確。
三.什么情況下可以前后端分離
1. 頁面交互比較復雜;
2. 前端的渲染比較頻繁;
從以上的信息我們可以了解到:前后端的好處是可以提高辦理業務的效率的。前后端分離之后是為了分工可以更明確。想要了解更多前后端的信息,請繼續關注中培偉業。