去年有個(gè)數(shù)據(jù)：全球Node.js項(xiàng)目里，43%已經(jīng)在用Next.js做全棧。這不是跟風(fēng)，是微服務(wù)架構(gòu)里藏著一個(gè)反直覺(jué)的選擇——讓前端框架同時(shí)當(dāng)后端入口。

一位金融科技團(tuán)隊(duì)的技術(shù)負(fù)責(zé)人最近分享了他們的實(shí)踐。團(tuán)隊(duì)后端拆成了支付、用戶、認(rèn)證三個(gè)獨(dú)立微服務(wù)，前端選了Next.js。但部署后他們發(fā)現(xiàn)，這個(gè)框架干了兩個(gè)人的活。

架構(gòu)圖：瀏覽器只認(rèn)識(shí)Next.js

具體結(jié)構(gòu)長(zhǎng)這樣。`/app`目錄下是React頁(yè)面，用戶看到的儀表盤、個(gè)人中心都在這里。但同級(jí)還有個(gè)`/app/api`目錄，里面藏著三條路由：認(rèn)證、支付、儀表盤數(shù)據(jù)聚合。

瀏覽器加載頁(yè)面時(shí)，完全感知不到后端微服務(wù)的存在。它只和Next.js說(shuō)話，Next.js再轉(zhuǎn)身去敲微服務(wù)的門。這種設(shè)計(jì)模式叫BFF（Backend for Frontend，服務(wù)于前端的后端），但通常BFF是獨(dú)立部署的服務(wù)，這里直接和前端代碼住在同一個(gè)項(xiàng)目里。

「我們算過(guò)賬，」技術(shù)負(fù)責(zé)人寫(xiě)道，「單獨(dú)維護(hù)一個(gè)BFF服務(wù)，意味著多一套CI/CD、多一組服務(wù)器、多一個(gè)故障點(diǎn)?！?/p>

安全決策：令牌根本不落地

真正拍板的關(guān)鍵因素是金融場(chǎng)景的安全紅線。微服務(wù)返回的訪問(wèn)令牌（access token），常規(guī)做法是丟給瀏覽器存在localStorage里。但XSS攻擊一旦得手，令牌直接泄露，攻擊者就能冒充用戶操作賬戶。

Next.js的API路由運(yùn)行在服務(wù)器端，這給了他們一個(gè)解法：令牌轉(zhuǎn)成HTTP-only cookie再發(fā)給瀏覽器。JavaScript完全讀不到這個(gè)cookie，即使頁(yè)面被注入惡意腳本，攻擊者也只能干瞪眼。

代碼邏輯很直接。登錄接口收到微服務(wù)返回的令牌后，立即塞進(jìn)cookie屬性里：`httpOnly: true`、`sameSite: 'strict'`。瀏覽器收到的只有`{ success: true }`，真正的令牌它從未見(jiàn)過(guò)。

「這是整個(gè)決策里權(quán)重最高的一條，」技術(shù)負(fù)責(zé)人強(qiáng)調(diào)，「安全優(yōu)先，其他都是后話?！?/p>

代價(jià)清單：不是免費(fèi)午餐

但省掉一個(gè)獨(dú)立BFF服務(wù)，不代表沒(méi)有成本。技術(shù)負(fù)責(zé)人列了三條明賬：

部署復(fù)雜度上升。Next.js項(xiàng)目既要跑Node.js服務(wù)，又要做服務(wù)端渲染（SSR, Server-Side Rendering），內(nèi)存和CPU占用比純靜態(tài)站點(diǎn)高出一截。團(tuán)隊(duì)最終選了Vercel的企業(yè)版，但遷移過(guò)程中踩過(guò)冷啟動(dòng)延遲的坑。

團(tuán)隊(duì)技能樹(shù)要重修。前端工程師突然要處理服務(wù)端邏輯：數(shù)據(jù)庫(kù)連接池、下游服務(wù)超時(shí)熔斷、內(nèi)存泄漏排查。「有人抱怨，我招的是React開(kāi)發(fā)，不是Node運(yùn)維，」技術(shù)負(fù)責(zé)人回憶。

故障排查變繞。一次支付失敗，日志要跨三層：瀏覽器控制臺(tái)→Next.js服務(wù)端日志→微服務(wù)日志。他們后來(lái)統(tǒng)一了Trace ID，但初期定位問(wèn)題的時(shí)間確實(shí)變長(zhǎng)了。

一個(gè)意外的場(chǎng)景

架構(gòu)跑通后，團(tuán)隊(duì)發(fā)現(xiàn)Next.js還解決了一個(gè)計(jì)劃外的問(wèn)題。他們的產(chǎn)品要在第三方網(wǎng)站嵌入動(dòng)態(tài)廣告，這些廣告需要實(shí)時(shí)拉取用戶偏好數(shù)據(jù)做個(gè)性化展示。

如果讓瀏覽器直接請(qǐng)求微服務(wù)，跨域配置和令牌傳遞都是麻煩。但走Next.js的API路由，同源策略天然成立，服務(wù)端還能做數(shù)據(jù)脫敏——比如把用戶ID哈希后再傳給廣告引擎。

「這個(gè)用法一開(kāi)始沒(méi)在架構(gòu)圖里，」技術(shù)負(fù)責(zé)人寫(xiě)道，「但BFF層的位置太舒服了，順理成章就長(zhǎng)出了新能力?！?/p>

目前這套架構(gòu)已經(jīng)支撐了8個(gè)月，峰值日活12萬(wàn)，Next.js層平均響應(yīng)時(shí)間控制在120ms以內(nèi)。技術(shù)負(fù)責(zé)人的最后一條筆記是：「如果重新選，我會(huì)把API路由拆得更薄，只留安全和聚合邏輯，業(yè)務(wù)計(jì)算還是下沉到微服務(wù)?！?/p>

你的團(tuán)隊(duì)在用Next.js做BFF嗎？是省事了，還是反而增加了心智負(fù)擔(dān)？