為什么要前后端分離？前后端分離的優(yōu)點(diǎn)是什么？

隨著互聯(lián)網(wǎng)的高速發(fā)展以及IT開(kāi)發(fā)技術(shù)的升級(jí)，前后端分離已成為互聯(lián)網(wǎng)項(xiàng)目開(kāi)發(fā)的業(yè)界標(biāo)準(zhǔn)使用方式。在實(shí)際工作中，前后端的接口聯(lián)調(diào)對(duì)接工作量占HTML5大前端人員日常工作的30%-50%，甚至?xí)?。接下?lái)千鋒小編分享的廣州HTML5大前端學(xué)習(xí)就給大家講解前后端分離接口。

為什么要前后端分離？

把前端與后端獨(dú)立起來(lái)去開(kāi)發(fā)，放在兩個(gè)不同的服務(wù)器，需要獨(dú)立部署。兩個(gè)不同的工程，兩個(gè)不同的代碼庫(kù)，不同的開(kāi)發(fā)人員，前后端工程師需要約定交互接口，實(shí)現(xiàn)同步開(kāi)發(fā)。開(kāi)發(fā)結(jié)束后需要進(jìn)行獨(dú)立部署，前端通過(guò)接口來(lái)調(diào)用調(diào)用后端的API，前端只需要關(guān)注頁(yè)面的樣式與動(dòng)態(tài)數(shù)據(jù)的解析和渲染，而后端專注于具體業(yè)務(wù)邏輯。

前后端分離的優(yōu)點(diǎn)是什么？

1、徹底解放前端。前端不再需要向后臺(tái)提供模板或是后臺(tái)在前端HTML中嵌入后臺(tái)代。

2、提高工作效率，分工更加明確。前端只關(guān)注前端的事，后臺(tái)只關(guān)心后臺(tái)的活，兩者開(kāi)發(fā)可以同時(shí)進(jìn)行，在后臺(tái)還沒(méi)有時(shí)間提供接口的時(shí)候，前端可以先將數(shù)據(jù)寫(xiě)死或者調(diào)用本地的JSON文件即可，頁(yè)面的增加和路由的修改也不必再去麻煩后臺(tái)，開(kāi)發(fā)更加靈活。

3、局部性能提升。通過(guò)前端路由的配置，我們可以實(shí)現(xiàn)頁(yè)面的按需加載，無(wú)需一開(kāi)始加載首頁(yè)便加載網(wǎng)站的所有的資源，服務(wù)器也不再需要解析前端頁(yè)面，在頁(yè)面交互及用戶體驗(yàn)上有所提升。

4、降低維護(hù)成本。通過(guò)目前主流的前端MVC框架，我們可以非?？焖俚亩ㄎ患鞍l(fā)現(xiàn)問(wèn)題的所在，客戶端的問(wèn)題不再需要后臺(tái)人員參與及調(diào)試，代碼重構(gòu)及可維護(hù)性增強(qiáng)。

5、實(shí)現(xiàn)高內(nèi)聚低耦合，減少后端（應(yīng)用）服務(wù)器的并發(fā)/負(fù)載壓力。

6、即使后端服務(wù)暫時(shí)超時(shí)或者宕機(jī)了，前端頁(yè)面也會(huì)正常訪問(wèn)，但無(wú)法提供數(shù)據(jù)。

7、可以使后臺(tái)能更好的追求高并發(fā)、高可用、高性能，使前端能更好的追求頁(yè)面表現(xiàn)、速度流暢、兼容性、用戶體驗(yàn)等。

前端工程是如何調(diào)用接口？

Ajax在瀏覽器與Web服務(wù)器之間使用異步數(shù)據(jù)傳輸（HTTP 請(qǐng)求），通過(guò)get或者post方法與服務(wù)器交互。

前端和后端之所以需要對(duì)接，是因?yàn)榍岸隧?yè)面只負(fù)責(zé)提供視圖沒(méi)有內(nèi)容，而后端只提供內(nèi)容，兩者所謂的對(duì)接，就是把后端的內(nèi)容放在前端頁(yè)面預(yù)留出來(lái)的位置上。（雖然說(shuō)是前端后端 ，但這一對(duì)接實(shí)際發(fā)生在服務(wù)器端）。

所以服務(wù)器端進(jìn)行的交互活動(dòng)如下：

接收用戶請(qǐng)求——》找到負(fù)責(zé)處理的程序——》處理程序找到要傳輸給用戶的前端頁(yè)面——》該前端頁(yè)面留出位置——》后端到數(shù)據(jù)庫(kù)取數(shù)據(jù)——》后端把數(shù)據(jù)放在前端留出來(lái)的位置上——》結(jié)合成真正用戶看到的HTML文件——》傳輸給用戶。