網(wǎng)友解答: 目前前后端分離已經(jīng)變得越來(lái)越流行了，越來(lái)越多的公司都選擇這種方式來(lái)進(jìn)行開(kāi)發(fā)。那么具體要怎么實(shí)現(xiàn)呢？下面我們來(lái)看下。如何實(shí)現(xiàn)前后端分離我們就根據(jù)我最近做的一個(gè)項(xiàng)目來(lái)展開(kāi)討論吧。

目前前后端分離已經(jīng)變得越來(lái)越流行了，越來(lái)越多的公司都選擇這種方式來(lái)進(jìn)行開(kāi)發(fā)。那么具體要怎么實(shí)現(xiàn)呢？下面我們來(lái)看下。

我們就根據(jù)我最近做的一個(gè)項(xiàng)目來(lái)展開(kāi)討論吧。

項(xiàng)目的主要技術(shù)架構(gòu)是：

數(shù)據(jù)庫(kù)采用MYSQL

緩存采用常用的redis去實(shí)現(xiàn)

后端采用php，主要用lumen框架去搭建

nodejs作為前端服務(wù)器，主要用來(lái)轉(zhuǎn)發(fā)請(qǐng)求

前端界面主要采用bulma框架搭建

定好了需要采用的技術(shù)和具體框架，那我們?nèi)绾卫们昂蠖朔蛛x開(kāi)發(fā)模式，開(kāi)始一個(gè)項(xiàng)目呢?

前端提供接口定義建議，和后端一起協(xié)商出接口文檔。有人會(huì)說(shuō)一般不都是后端一方去提供接口定義嘛，其實(shí)在日常項(xiàng)目開(kāi)發(fā)過(guò)程中，前端是最熟悉頁(yè)面交互操作的，哪邊需要什么數(shù)據(jù)，哪邊需要一個(gè)什么標(biāo)志位，這些沒(méi)人比他們更清楚啦，因此他們作為接口文檔的主要定義者最適合不過(guò)了。當(dāng)然，如果某個(gè)接口涉及到比較多的業(yè)務(wù)模塊時(shí)，就需要和后端一起去協(xié)商，怎么定義更合適啦。最后后端把具體的接口文檔整理實(shí)現(xiàn)出來(lái)，雙方再進(jìn)行review，等到雙方都認(rèn)可了，正式的接口文檔也就出來(lái)了。

前后端同步開(kāi)發(fā)?？墒呛蠖私涌跊](méi)寫(xiě)好，前端怎么開(kāi)發(fā)啊？這就要前端同學(xué)自行mock數(shù)據(jù)（利用本地json文件，或者在線的一些mock工具）了，然后邊寫(xiě)頁(yè)面邊測(cè)試。而后端代碼中除了功能實(shí)現(xiàn)外，也會(huì)有詳細(xì)的測(cè)試用例，以保證API的可用性，降低集成風(fēng)險(xiǎn)。這樣下來(lái)前后端就可以進(jìn)行快速的聯(lián)調(diào)集成了。

從上面可以看到，前后端互不干擾，并行開(kāi)發(fā)，在這個(gè)過(guò)程中nodejs起到很大的作用。

先上圖：

Node+Server是一種常見(jiàn)的前后端分離方案，也是淘寶所使用的前后端分離方案，在瀏覽器與后端服務(wù)器之間增加一個(gè)了node server作為中間層，前端資源部署到Node Server中，node server中的model proxy，負(fù)責(zé)與服務(wù)端進(jìn)行通信。

瀏覽器發(fā)出的請(qǐng)求都會(huì)被node server接收，然后通過(guò)model proxy調(diào)用后端服務(wù)器提供的接口。node server接收到后端服務(wù)器反饋回來(lái)的數(shù)據(jù)，接著在node server中完成頁(yè)面的組裝渲染，把最終頁(yè)面返回給瀏覽器。

這樣，前后端就實(shí)現(xiàn)了分離和解耦，而且nodejs本身有著獨(dú)特的異步、非阻塞I/O的特點(diǎn)，也就是說(shuō)它特別適合I/O密集型操作，在處理并發(fā)量比較大的請(qǐng)求上能力比較強(qiáng)，因此，利用它來(lái)充當(dāng)前端服務(wù)器，向客戶端提供靜態(tài)文件以及響應(yīng)客戶端的請(qǐng)求，是一個(gè)很不錯(cuò)的選擇。

如果后期并發(fā)性不足，性能跟不上，也可以考慮加上nginx。主要實(shí)現(xiàn)方式就是用nginx來(lái)做反向代理，根據(jù)客戶端訪問(wèn)的url去轉(zhuǎn)發(fā)到不同的服務(wù)，這樣對(duì)性能的提升會(huì)有很大幫助。

關(guān)于題主問(wèn)的如何寫(xiě)出高逼格的API？這個(gè)我不知道下面說(shuō)的是否夠高逼格哈。

這些都搞好了，肯定高逼格??！