vue 先後端分離的原理

一： 原始人時代

1，定需求
2，敲代碼
3，測試
4，發佈，須要用eclipse把代碼打成一個war包，而後把這個war包發佈到生產環境下的web容器裏。這時候先後端代碼都在這個war包裏，html，js，css，各類第三方庫等。這樣服務器壓力會很大，頁面中的全部請求都要經過這個服務器，若是同時不少人訪問這個網站速度就會很慢。一旦服務器出現情況，先後端一塊兒玩完，用戶體驗級差。。

---

二： 新的方式

1，瀏覽器發送請求
2，直接到達html頁面（前端控制路由和渲染頁面，整個項目開發的權重前移）
3，html頁面負責調用服務器端接口產生數據（經過ajax等等，後臺返回json數據）
4，填充html，展示動態效果，在頁面上進行解析並操做

---

三： 先後端分離的優點

1，能夠實現正真的先後端解耦，前端服務器放 css，js，圖片等一系列資源，前端服務器負責控制頁面引用，跳轉，路由。前端頁面異步調用後端的接口。加快總體響應速度。

2，發現bug，能夠快速定位是誰的問題，頁面邏輯，跳轉錯誤，瀏覽器兼容問題，腳本錯誤，頁面樣式等問題由前端解決。接口數據出錯，數據沒有提交成功，響應超時等由後臺負責。雙方互不干擾。

3，減小後端服務器的開發/負載壓力。除了接口外的http請求所有轉到 前端nginx上。

5，即便後端服務器暫停超時或者宕機了，前端頁面也會正常訪問。只不過數據刷不出來而已。

6，增長代碼的維護性，易讀性。

7，前端大量的組件化代碼 能夠抽出來複用，組件化開發提高效率。

---

四： 注意事項

1，再開需求會議的時候，先後端都須要參加，而且制定好接口文檔。

2，加劇了前端的工做量，減輕了後端的工做量。提升了性能和可擴展性。

3，若是你的項目很小，並且是一個內網項目，不用任何架構而言。

4，前端須要有機制應對後端請求超時以及宕機的狀況，有好的展現給客戶。

---

五： 總結

千萬不要覺得只有敲代碼的時候把前端和後端分開就是先後端分離了，須要區分先後端項目。

前端與後端是兩個項目。放在兩個不一樣的服務器，須要獨立部署。

兩個不一樣的工程，兩個不一樣的代碼庫，不一樣的開發人員。

先後端須要約定交互接口，實現並行開發，開發結束後須要進行獨立部署。