0.前言
作為產(chǎn)品經(jīng)理，不想被技術(shù)罵成傻逼，那就看一點關(guān)于技術(shù)的書，不需要掌握，知曉原理就成，知道自己設(shè)計的產(chǎn)品在技術(shù)層面如何進(jìn)行運作的，這十分有必要。Ok，寫篇文章簡單介紹一下客戶端架構(gòu)的基本原理，但不涉及具體的代碼實現(xiàn)。另外，“架構(gòu)”這個詞聽起來很牛逼，這里裝逼用一下，真正的架構(gòu)會比這復(fù)雜的多！
1.客戶端架構(gòu)原理
客戶端即前端，就是我們平時使用的APP、打開的網(wǎng)頁等，主要是對數(shù)據(jù)的展示，一切用戶進(jìn)行可視化操作的統(tǒng)稱為客戶端。當(dāng)我們使用一款A(yù)PP，在把玩的過程中，會與后端進(jìn)行通信，把用戶想要的東西展現(xiàn)出來，其原理如下圖：
拿我經(jīng)常使用的手機“鳳凰新聞客戶端”為例，當(dāng)你對新聞客戶端里面的某條新聞感興趣并點擊這條新聞，客戶端立馬組織數(shù)據(jù)請求，這時用戶界面開始展示loading（表明客戶端在向后端請求數(shù)據(jù)），經(jīng)過幾百毫秒的時間，這個時候請求數(shù)據(jù)已經(jīng)到了服務(wù)器，服務(wù)器開始查看客戶端想要請求哪方面的數(shù)據(jù)（是請求的哪條新聞），服務(wù)器看到你請求的是“XX新聞”，并通過API接口將查到的數(shù)據(jù)返回給客戶端，傳回的數(shù)據(jù)被客戶端接收，loading消失，你將會看到“XX新聞”的具體內(nèi)容。對于服務(wù)端而言，他的數(shù)據(jù)來源于基礎(chǔ)數(shù)據(jù)庫，基礎(chǔ)數(shù)據(jù)庫的數(shù)據(jù)如果有變動，他也需要隨著基礎(chǔ)數(shù)據(jù)庫的變化而更新。
2.前端和后端如何進(jìn)行數(shù)據(jù)傳輸
現(xiàn)在流行的做法通常有兩種，一種是類似于PB（Protocol Buffer，Google定義的一個數(shù)據(jù)傳輸協(xié)議，以簡潔，省流，易用出名）的二進(jìn)制數(shù)據(jù)（二進(jìn)制數(shù)據(jù)的意思就是你打開這個文件你只能看到0和1組成的數(shù)字串，是沒辦法和你生活中任何認(rèn)識的字母聯(lián)系在一起的）傳輸，這種格式的好處是包小，重復(fù)的字段會被節(jié)省。另一種是JSON（JavaScriptObject Notation），這也是一種輕量級的數(shù)據(jù)傳輸格式，就是用一堆中括號把數(shù)據(jù)組織起來，不像二進(jìn)制，這種格式是人可讀的，并且比較輕巧，所以也有大量的應(yīng)用場景。
3.實例說明
以我現(xiàn)在做的一個電商APP的“訂單確認(rèn)”界面（與后端進(jìn)行數(shù)據(jù)通訊最多的一個界面）為例：
這個訂單確認(rèn)界面需要與后端進(jìn)行數(shù)據(jù)通訊，需要通訊的數(shù)據(jù)有：收貨地址、支付方式、紅包選擇、發(fā)票、商品金額、運費、優(yōu)惠、滿減、最終需支付金額。這些與服務(wù)端進(jìn)行數(shù)據(jù)交互都需要接口來實現(xiàn)。
在收貨地址的API接口里，需要返回收貨人姓名、電話、收貨詳細(xì)地址，這個API會請求對應(yīng)的服務(wù)接口；在紅包接口當(dāng)中，需要回傳紅包的面額、使用期限、紅包名稱，一旦用戶選擇了某個紅包，客戶端會通過API接口向服務(wù)端請求這些業(yè)務(wù)數(shù)據(jù)。紅包數(shù)據(jù)請求過來后，界面在極短極短的時間內(nèi)刷新，并在再次向后端請求最后支付金額的基礎(chǔ)數(shù)據(jù)，通過這一前端和后端的交互，最終的支付金額數(shù)據(jù)被傳回來。其他的幾個接口也基本是這樣的交互形式。
4.設(shè)計注意事項
我們知道客戶端架構(gòu)的基本原理之后，在做產(chǎn)品設(shè)計的時候就可以考慮的更長遠(yuǎn)一些，比如我們一直強調(diào)的系統(tǒng)可擴(kuò)展性！簡單來說，對于客戶端而言，盡可能不要做太多邏輯處理，而只是展示API給的數(shù)據(jù)，邏輯處理盡量后臺來完成?？蛻舳酥回?fù)責(zé)劃定顯示區(qū)域、數(shù)據(jù)的顯示以及頁面與頁面之間的交互，這樣懟擴(kuò)展性會更加好。這就需要前端不要把“程序?qū)懰馈?，一旦寫死，以后需要對現(xiàn)在寫死的內(nèi)容進(jìn)行修改，那就要重新發(fā)布版本了，要知道，重新發(fā)布一個版本（特別是發(fā)布到APPstore）成本是較大的。
