寫(xiě)給產(chǎn)品經(jīng)理的技術(shù)書(shū):客戶(hù)端、服務(wù)端和交互相關(guān)技術(shù)

43 評(píng)論 111986 瀏覽 2155 收藏 71 分鐘

產(chǎn)品經(jīng)理有三大領(lǐng)域的技術(shù)是需要去攻克的,分別是:客戶(hù)端相關(guān)技術(shù)、服務(wù)端相關(guān)技術(shù)、交互相關(guān)技術(shù)

一、客戶(hù)端相關(guān)技術(shù)

1.iOS和安卓產(chǎn)品差異

1.1 應(yīng)用的設(shè)備不同:

IOS和安卓最大的區(qū)別在于本身所應(yīng)用的設(shè)備不同。IOS系統(tǒng)主要是應(yīng)用在iPhone、IPad、itouch設(shè)備上的操作系統(tǒng),安卓系統(tǒng)主要是應(yīng)用在安卓智能手機(jī)上的操作系統(tǒng)。

1.2 面向人群不同:

IOS系統(tǒng)面向的是中高層收入的人群,有人稱(chēng)它為“高富帥”系統(tǒng),而安卓系統(tǒng)則是面試中低層的大眾人群,有人稱(chēng)它為“屌絲系統(tǒng)”。

1.3系統(tǒng)的開(kāi)放性區(qū)別:

安卓擁有自己的開(kāi)源計(jì)劃AOSP(Android Open Source Project),只要遵循GPL和Apache Licence 2.0開(kāi)源協(xié)議,那么你就可以使用安卓源代碼進(jìn)行二次開(kāi)發(fā)。而安卓由于源代碼開(kāi)放,自然可玩性也比iOS高。此外,安卓比iOS開(kāi)放了更多的應(yīng)用接口API,可以很自然地利用安卓實(shí)現(xiàn)很多在iOS上不折騰就沒(méi)法做的功能。在安卓,可以隨心隨意地更換輸入法,隨意用任何瀏覽器打開(kāi)鏈接,隨意從任何途經(jīng)安裝程序,隨意調(diào)用第三方程序分享文件——這些在iOS上不越獄都做不到,即使越獄也未必比安卓做得更好。

1.4系統(tǒng)的安全性區(qū)別:

IOS系統(tǒng)是一款比較強(qiáng)大的操作系統(tǒng),在IOS系統(tǒng)運(yùn)行的程序不管程序多大都不會(huì)造成死機(jī),玩起來(lái)非常的流程,而且系統(tǒng)的安全性比較高。

安卓系統(tǒng)是屬于代碼系統(tǒng),如果所有的應(yīng)用程序需要下載下來(lái)之后才能玩,系統(tǒng)用久之后會(huì)經(jīng)常出現(xiàn)卡機(jī)或者是死機(jī)的現(xiàn)象,而且安卓系統(tǒng)還存在惡意的插件在系統(tǒng)上自動(dòng)運(yùn)行,系統(tǒng)漏洞多,導(dǎo)致個(gè)人資料被盜、系統(tǒng)耗電大,流量消耗大等,系統(tǒng)安全性相對(duì)來(lái)說(shuō)比較低。

1.5開(kāi)發(fā)難度不同:

蘋(píng)果提供完整高效xcode,sdk等開(kāi)發(fā)環(huán)境,ios系統(tǒng)一脈相承,ios版本之間的軟件通用,即開(kāi)發(fā)一款產(chǎn)品蘋(píng)果所有設(shè)備都能運(yùn)行。其硬件的強(qiáng)大也讓開(kāi)發(fā)變的更加容易。

2.Web前端技術(shù)-HTML、CSS、JavaScript

  • HTML、CSS、JavaScript共同構(gòu)建了你看到的任何一個(gè)網(wǎng)頁(yè)展示和交互:
  • HTML(HyperTextMarkup Language)超文本標(biāo)記語(yǔ)言
  • CSS(Cascading Style Sheets)級(jí)聯(lián)樣式表
  • JavaScript一種腳本語(yǔ)言,主要用于前端頁(yè)面的DOM處理

文本的意思,應(yīng)該大家都明白,就是你隨手在桌面上建立一個(gè)txt,這就是一個(gè)文本文件。

那什么是HTML超文本標(biāo)記語(yǔ)言呢?超文本就是超越文本的意思唄,超越文本的意思就是它已經(jīng)不僅僅是簡(jiǎn)單的文本,比普通的txt要高級(jí)一些,那到底高級(jí)在哪里呢,是第二個(gè)詞Markup(標(biāo)記的意思),就是對(duì)一個(gè)普通的txt里面的文字進(jìn)行標(biāo)記,標(biāo)記其中的一段為title,標(biāo)記另一段應(yīng)該另起一行,標(biāo)記任意一段為某個(gè)意思。最后超越了普通文本的標(biāo)記,這些記號(hào)對(duì)普通文本的修飾,就構(gòu)成了一套規(guī)則,這套規(guī)則就是html。

CSS中文名叫級(jí)聯(lián)樣式表,也是一個(gè)超別扭的名字,但是樣式大家都應(yīng)該懂,就是長(zhǎng)什么樣子,類(lèi)比到生活中,就是HTML只是你的肉體,你總要穿上衣服,戴上牙套,穿雙鞋再出門(mén)吧。再舉剛才蓋房子的例子,你定義好了各個(gè)空間,并且房子也蓋起來(lái)了,你要裝修,比如客廳用什么壁紙,臥室的地板用什么樣子,CSS就是起裝修作用的,必須要和HTML一起配合使用。

JavaScript是一種腳本語(yǔ)言,他在網(wǎng)頁(yè)中使用的主要場(chǎng)景是控制HTML中的每一個(gè)元素,有時(shí)候可以把有些元素刪除,有時(shí)候要添加新元素,你常常遇到過(guò)這樣的場(chǎng)景,點(diǎn)了一個(gè)按鈕,這個(gè)時(shí)候會(huì)有一個(gè)網(wǎng)頁(yè)上從沒(méi)有過(guò)的元素出來(lái),其實(shí)就是利用JavaScript實(shí)現(xiàn)的。你的房子已經(jīng)裝修好,貼上了墻紙,鋪上了地板,桌子,板凳,沙發(fā)都已經(jīng)擺好了,一切都完美了,可是一切都是靜態(tài)的,作為一個(gè)有生活情趣的人,你總是要買(mǎi)些新家具,或者想把茶幾換個(gè)位置,這個(gè)時(shí)候這種在這個(gè)屋子里的所有移動(dòng),添加,減少物件就只能靠JavaScript實(shí)現(xiàn)。

當(dāng)前互聯(lián)網(wǎng)上的任何一個(gè)網(wǎng)頁(yè),都是由他們?nèi)齻€(gè)構(gòu)建起來(lái)的,雖然簡(jiǎn)單,但你不可不知。

3.實(shí)時(shí)更新移動(dòng)客戶(hù)端技術(shù)–React Native

做為一名產(chǎn)品經(jīng)理,你是否遇到過(guò)這樣的窘境,“幫我把字體調(diào)成16號(hào)唄,顏色變成#FFFF00FF,老大說(shuō)這里最好改一下”,作為一名app的開(kāi)發(fā)只能無(wú)奈但心里竊喜的告訴你,“只能等下個(gè)版本了,必須要重新發(fā)布才能改”,如果你問(wèn)為什么不能改了就生效啊,那說(shuō)明你對(duì)技術(shù)的理解要么真的很差,要么你就是知道這項(xiàng)React-Native新技術(shù)所爆發(fā)出來(lái)的力量。

React Native是Facebook推出的一個(gè)用JavaScript語(yǔ)言就能同時(shí)編寫(xiě)ios,android,以及后臺(tái)的一項(xiàng)技術(shù),2015年9月發(fā)布了android版本,又在程序員里面掀起了一波小高潮,不斷有喜歡嘗鮮的程序員投入到這個(gè)領(lǐng)域。用大白話(huà)說(shuō),就是從此一名程序員自己就可以創(chuàng)業(yè)了,他只用這一門(mén)技術(shù),就可以同時(shí)寫(xiě)出androidapp,ios app,以及后臺(tái)應(yīng)用程序,并且,請(qǐng)注意這里,它可以做到實(shí)時(shí)熱更新(就像網(wǎng)頁(yè)一樣,改了一個(gè)字體,隨時(shí)可上線(xiàn)),app也能做到隨時(shí)都能更新了,第一段講的那個(gè)需求可以分分鐘秒殺解決,不用新發(fā)版本,只需在服務(wù)器改動(dòng)一下代碼即可,真的很牛逼。

4.Android應(yīng)用權(quán)限

目前國(guó)內(nèi)Top 100的熱門(mén)應(yīng)用,來(lái)看看它們最喜歡的申請(qǐng)的權(quán)限是什么,以及拿到這些權(quán)限后可用做些什么事情:

網(wǎng)絡(luò)訪問(wèn)權(quán)限

互聯(lián)網(wǎng)產(chǎn)品,當(dāng)然要聯(lián)網(wǎng)才行啦,所以每個(gè)應(yīng)用都申請(qǐng)了這個(gè)權(quán)限

修改或刪除外置存儲(chǔ)中的內(nèi)容

往用戶(hù)的SDCard上隨意讀寫(xiě)文件的權(quán)限。當(dāng)你的手機(jī)用了一段時(shí)間后,發(fā)現(xiàn)SDCard上面亂糟糟的,什么奇怪的文件名都有,就是因?yàn)檫@個(gè)權(quán)限,每個(gè)應(yīng)用都想著你手機(jī)里留下一些痕跡。其實(shí)為了存儲(chǔ)數(shù)據(jù),系統(tǒng)給了特定的存儲(chǔ)空間,這并不是應(yīng)用必須要用的權(quán)限。

讀取手機(jī)狀態(tài)和身份

有了這個(gè)權(quán)限,可以獲取到手機(jī)的唯一識(shí)別碼IMEI,很多應(yīng)用用它來(lái)做為單一用戶(hù)的標(biāo)識(shí),沒(méi)什么可怕的。

查看WLAN連接

可以查看用戶(hù)當(dāng)前的WiFi接入點(diǎn)信息

控制振動(dòng)

這個(gè)沒(méi)什么好說(shuō),就是要讓你手機(jī)有動(dòng)次達(dá)次的效果

檢索正在運(yùn)行的應(yīng)用

可以查看用戶(hù)當(dāng)前運(yùn)行了哪些應(yīng)用,瞅瞅你平時(shí)喜歡用些什么應(yīng)用,也可以看看競(jìng)品的活躍程度:)

防止手機(jī)休眠

在鎖屏后為了降低功耗系統(tǒng)會(huì)進(jìn)入休眠狀態(tài),但是很多應(yīng)用為了維持后臺(tái)運(yùn)行,就會(huì)申請(qǐng)這個(gè)權(quán)限,這也是Android系統(tǒng)比較耗電的原因之一,都是應(yīng)用希望知道用戶(hù)的位置(基于網(wǎng)絡(luò)),O2O這么火的年代,為了提供更個(gè)人化的服務(wù),各路應(yīng)用都希望知道用戶(hù)的當(dāng)前位置。

開(kāi)機(jī)啟動(dòng)

要想日日夜夜的陪伴,那就得一開(kāi)機(jī)就啟動(dòng),也是耗電的罪魁

相機(jī)

幫你打開(kāi)相機(jī),掃一掃二維碼,拍一拍片片

在其他應(yīng)用之上顯示內(nèi)容

桌面上那些飄來(lái)飄去的東西,或者你正用著一個(gè)應(yīng)用,其它某個(gè)APP又突然蹦了出來(lái)蓋在上面,都是用的這個(gè)權(quán)限

精確位置(基于GPS和網(wǎng)絡(luò))

三胖想定點(diǎn)轟炸你,就得用這個(gè)權(quán)限,獲取精確的GPS位置

安裝快捷方式

很多應(yīng)用希望用戶(hù)更方便的啟動(dòng)自己,都喜歡往桌面上發(fā)送一個(gè)快捷圖標(biāo),更有喪心病狂的應(yīng)用,會(huì)發(fā)送多個(gè)圖標(biāo)到桌面。往往新買(mǎi)一個(gè)手機(jī),安裝10個(gè)應(yīng)用,桌面上會(huì)出現(xiàn)20個(gè)以上圖標(biāo)的,就是因?yàn)樗?/p>

錄音

每個(gè)應(yīng)用都有一個(gè)成為微信的夢(mèng)想

卸載快捷方式

悄悄的將自(友)己(商)的圖標(biāo)刪掉:)

讀取聯(lián)系人信息

大家都對(duì)這個(gè)權(quán)限很敏感,應(yīng)用有了這個(gè)權(quán)限,就可以讀取你的通訊錄,不懷好意的應(yīng)用還會(huì)偷偷上傳,哪天你收到垃圾短信也不必奇怪,也許是你的某個(gè)好基友“出賣(mài)”了你

停用屏幕鎖定

你得一直看著我,不要讓屏幕鎖定了

發(fā)送短信

有了這個(gè)權(quán)限,就可以花用戶(hù)的錢(qián),給自己發(fā)條短信。感覺(jué)應(yīng)用都沒(méi)有什么正當(dāng)理由來(lái)獲取這個(gè)權(quán)限

讀取短信

查看用戶(hù)的短信,感覺(jué)這是老大哥干的事,普通應(yīng)用拿來(lái)是夠惡心的

5.Android休眠狀態(tài)

(1)任何一個(gè)應(yīng)用申請(qǐng)了wakelock鎖,待機(jī)(按:什么是待機(jī)?待機(jī)與屏幕黑、鎖屏、休眠的關(guān)系是什么?)時(shí)沒(méi)有釋放掉,系統(tǒng)是不會(huì)進(jìn)入待機(jī)的,直到所有應(yīng)用的wakelock鎖都釋放掉了,才會(huì)進(jìn)入待機(jī)。

(2)如果不進(jìn)行特別的設(shè)置,Android會(huì)在一定時(shí)間后屏幕變暗,在屏幕變暗后一定時(shí)間內(nèi),CPU也會(huì)休眠,大多數(shù)的程序都會(huì)停止運(yùn)行,從而節(jié)省電量。

(3)Android手機(jī)有兩個(gè)處理器,一個(gè)叫Application Processor(AP),一個(gè)叫Baseband?Processor(BP)。非通話(huà)時(shí)間,BP的能耗基本上在5mA左右,而AP只要處于非休眠狀態(tài),能耗至少在50mA以上,執(zhí)行圖形運(yùn)算時(shí)會(huì)更高。一般手機(jī)待機(jī)時(shí),AP、LCD、WIFI均進(jìn)入休眠狀態(tài),這時(shí)Android中應(yīng)用程序的代碼也會(huì)停止執(zhí)行。Android為了確保應(yīng)用程序中關(guān)鍵代碼的正確執(zhí)行,提供了Wake Lock的API,使得APP可以通過(guò)之阻止AP進(jìn)入休眠。但不一定必要,首先,完全沒(méi)必要擔(dān)心AP休眠會(huì)導(dǎo)致收不到消息推送。通訊協(xié)議棧運(yùn)行于BP,一旦收到數(shù)據(jù)包(按:收到TCP數(shù)據(jù)包才會(huì)喚醒AP,UDP包不會(huì)喚醒),BP會(huì)將AP喚醒,喚醒的時(shí)間足夠AP執(zhí)行代碼完成對(duì)收到的數(shù)據(jù)包的處理過(guò)程。其它的如Connectivity事件觸發(fā)時(shí)AP同樣會(huì)被喚醒。那么唯一的問(wèn)題就是程序如何執(zhí)行向服務(wù)器發(fā)送心跳包的邏輯。你顯然不能靠AP來(lái)做心跳計(jì)時(shí)。Android提供的Alarm Manager就是來(lái)解決這個(gè)問(wèn)題的。Alarm應(yīng)該是BP計(jì)時(shí)(或其它某個(gè)帶石英鐘的芯片,不太確定,但絕對(duì)不是AP),觸發(fā)時(shí)喚醒AP執(zhí)行程序代碼。那么Wake Lock API有啥用呢?比如心跳包從請(qǐng)求到應(yīng)答,比如斷線(xiàn)重連重新登陸這些關(guān)鍵邏輯的執(zhí)行過(guò)程,就需要Wake Lock來(lái)保護(hù)(按:只在這些關(guān)鍵邏輯時(shí),需要Wake Lock API確保不休眠)。而一旦一個(gè)關(guān)鍵邏輯執(zhí)行成功,就應(yīng)該立即釋放掉Wake Lock了。兩次心跳請(qǐng)求間隔5到10分鐘,基本不會(huì)怎么耗電。除非網(wǎng)絡(luò)不穩(wěn)定,頻繁斷線(xiàn)重連,那種情況辦法不多。

(4)Android設(shè)置–> WLAN–>點(diǎn)擊菜單鍵選擇高級(jí)–>休眠狀態(tài)下保持WLAN連接的下拉列表{始終、僅限充電時(shí)、從不(會(huì)增加數(shù)據(jù)流量)},如果設(shè)置不為始終,那么我們鎖屏休眠后,程序?qū)?huì)處于無(wú)網(wǎng)絡(luò)狀態(tài),相應(yīng)的app用戶(hù)會(huì)一直處于離線(xiàn)模式。

(5)可以設(shè)置不同的模式,讓其產(chǎn)生不同的休眠,比如讓cpu保持運(yùn)行。

  • Flag Value CPU Screen Keyboard
  • PARTIAL_WAKE_LOCK On Off Off
  • SCREEN_DIM_WAKE_LOCK On Dim Off
  • SCREEN_BRIGHT_WAKE_LOCK On Bright Off
  • FULL_WAKE_LOCK On Bright Bright

6.a(chǎn)pp推送原理

傳統(tǒng)的app架構(gòu)里,通常是app主動(dòng)向服務(wù)器請(qǐng)求數(shù)據(jù),服務(wù)器被動(dòng)的提供數(shù)據(jù)。以新聞客戶(hù)端app為例:app被用戶(hù)打開(kāi)的時(shí)候,會(huì)通過(guò)網(wǎng)絡(luò)(無(wú)論3g、4g還是wifi)連接到服務(wù)器上,向服務(wù)器請(qǐng)求最新的新聞。服務(wù)器收到請(qǐng)求,從自己的數(shù)據(jù)庫(kù)里查詢(xún)最新的新聞,返回給app。app收到服務(wù)器返回的數(shù)據(jù),經(jīng)過(guò)一系列的解析處理操作,最終把最新的新聞呈現(xiàn)給用戶(hù)。一次通信就完成了。

沒(méi)推送功能,你好意思叫 app 嘛?

然而如果此時(shí)服務(wù)器上又有了新的新聞,無(wú)論多么重要,在用戶(hù)沒(méi)有主動(dòng)刷新的情況下,是沒(méi)有辦法讓用戶(hù)看到的。推送就是為了解決這樣的困境的,它給了服務(wù)器一個(gè)展示自我的機(jī)會(huì),主動(dòng)連接上所有的app,告訴他們我有新的新聞了,你們?cè)賮?lái)請(qǐng)求一次吧,于是收到推送的app(即時(shí)此時(shí)已經(jīng)被用戶(hù)關(guān)閉了)又去服務(wù)器請(qǐng)求最新的新聞,這樣用戶(hù)就能看到最新的新聞了。

沒(méi)推送功能,你好意思叫 app 嘛?

從技術(shù)上來(lái)講,實(shí)現(xiàn)一個(gè)推送系統(tǒng)需要服務(wù)器端和終端的配合。一種方法是輪詢(xún),也就是不停的向服務(wù)器發(fā)起請(qǐng)求。這其實(shí)很好理解,作為app,我既然不知道什么時(shí)候會(huì)發(fā)生新的新聞,那我一遍一遍的問(wèn)好了,而且我知道這樣一定會(huì)成功的。顯而易見(jiàn),這種方法app端費(fèi)時(shí)費(fèi)力不說(shuō),電量流量也扛不住啊,服務(wù)器要處理如此量大的請(qǐng)求,必然也是非常頭疼的。

另一種方法是服務(wù)器和app建立一個(gè)長(zhǎng)時(shí)間連接的通道,通過(guò)這個(gè)通道,不僅app可以向服務(wù)器請(qǐng)求數(shù)據(jù),服務(wù)器也可以向app發(fā)送數(shù)據(jù),看起來(lái)非常完美,但是如果app被用戶(hù)關(guān)閉的話(huà),通道就斷掉了。好在android系統(tǒng)給app提供了一個(gè)這樣的環(huán)境,app可以啟動(dòng)一個(gè)后臺(tái)服務(wù)來(lái)維持這個(gè)通道,即使app被關(guān)掉了,服務(wù)依然可以運(yùn)行,通道依然還在工作(ios后面會(huì)講)。回到前面的例子,你在睡覺(jué)前關(guān)掉了淘寶,但是并沒(méi)有關(guān)閉淘寶的后臺(tái)服務(wù),淘寶依然可以接收服務(wù)器推送來(lái)的指令,把自己的喚醒。

那么如何維持這樣的一條長(zhǎng)時(shí)間連接的通道呢?就好比兩個(gè)人打電話(huà),一開(kāi)始聊的熱情有來(lái)有往,后來(lái)慢慢沉默下來(lái)了,幾分鐘之后,電話(huà)的另一頭沒(méi)有任何動(dòng)靜,如何知道那邊的人還在呢?很簡(jiǎn)單,只需要另一頭的人每隔幾分鐘說(shuō)一個(gè)字就行。同樣的道理,app會(huì)每隔一段時(shí)間向服務(wù)器報(bào)告自己還活著,就像心跳一樣,服務(wù)器收到后,就知道這個(gè)通道是可以繼續(xù)使用的了。

然而天下沒(méi)有免費(fèi)的午餐,發(fā)送心跳是有代價(jià)的,一般手機(jī)鎖屏之后,為了省電CPU是出于休眠狀態(tài)的,然而發(fā)送心跳就會(huì)喚醒CPU,必然會(huì)增加電量的消耗。這還只是一個(gè)長(zhǎng)連接通道的情況,如果手機(jī)里裝了2、30個(gè)帶有推送的app呢?先別急著抱怨,聰明的android工程師和ios工程師早就想到了這一點(diǎn),他們分別設(shè)計(jì)了GCM和APNS來(lái)解決多個(gè)app有多個(gè)長(zhǎng)連接通道的問(wèn)題。

以APNS為例,ios開(kāi)通了一條系統(tǒng)級(jí)別的長(zhǎng)連接通道,通道的一端是手機(jī)的所有app,另一端是蘋(píng)果的服務(wù)器。app的服務(wù)器如果有新的消息需要推送的話(huà),先把消息發(fā)送到蘋(píng)果的服務(wù)器上,再利用蘋(píng)果的服務(wù)器通過(guò)長(zhǎng)連接通道發(fā)送到用戶(hù)手機(jī),然后通知具體的app。這樣就做到了即使手機(jī)安裝了100個(gè)app,也只需要向一條通道里發(fā)送心跳。

沒(méi)推送功能,你好意思叫 app 嘛?

回到Android,系統(tǒng)提供的GCM只能在Android2.2以上才能使用,3.0以下必須要安裝Google play并登陸了Google賬號(hào)才能支持。而國(guó)內(nèi)發(fā)行的手機(jī)大多是閹割掉了google服務(wù)的。因此,對(duì)于Android系統(tǒng)來(lái)說(shuō),各家app只能各顯神通,開(kāi)發(fā)自己的專(zhuān)用長(zhǎng)連接通道了。然而這時(shí)候他們遇到了app的天敵:管家和衛(wèi)士們。

前文說(shuō)了,app想要及時(shí)收到服務(wù)器推送的消息,關(guān)鍵在于自己與服務(wù)器的長(zhǎng)連接通道不被關(guān)閉,也就是自己的后臺(tái)服務(wù)可以一直在后臺(tái)運(yùn)行,而管家和衛(wèi)士們的一鍵清理功能就是專(zhuān)治這種“毒瘤”的。道高一尺魔高一丈,app在與管家和斗士們的長(zhǎng)期斗爭(zhēng)中,總結(jié)了一系列躲避被清理掉的方法,什么定時(shí)自啟能力、什么相互喚醒、什么前臺(tái)進(jìn)程等等,當(dāng)然這就是另一個(gè)話(huà)題了,我們后面會(huì)講到。

總結(jié)起來(lái),app和后臺(tái)的連接方式有兩種。一種叫pull,也叫輪詢(xún),就是定期的不斷向后臺(tái)請(qǐng)求,缺點(diǎn)是耗電,費(fèi)流量,不環(huán)保。對(duì)于一名有追求的程序員,他應(yīng)該會(huì)比較惡心這種方式的,你千萬(wàn)不要對(duì)他說(shuō),我不管你怎么實(shí)現(xiàn),我就要這種效果這種笨蛋話(huà)了,凡事應(yīng)該找到最優(yōu)路徑。

另一種叫push,app和后臺(tái)一直維持了一條通信通道,兩端不定期的就會(huì)偷摸的約會(huì),告訴對(duì)方“I‘m Here”,也能順帶把信息互相攜帶了。缺點(diǎn)是要維持一條長(zhǎng)連接通道,這條通道容易被其他程序殺死,要多想復(fù)活辦法。

7.應(yīng)用程序、進(jìn)程和線(xiàn)程

應(yīng)用程序都是用來(lái)“應(yīng)用”的,也就是我們平時(shí)所說(shuō)的“打開(kāi)”、“運(yùn)行”某個(gè)應(yīng)用程序。

在每個(gè)平臺(tái)上,應(yīng)用程序都會(huì)有一個(gè)供操作系統(tǒng)使用的“入口”,這個(gè)“入口”就是讓系統(tǒng)通知應(yīng)用程序“運(yùn)行”的關(guān)鍵所在,也就是系統(tǒng)啟動(dòng)應(yīng)用程序的門(mén)戶(hù)。當(dāng)我們點(diǎn)擊桌面上應(yīng)用的圖標(biāo),系統(tǒng)就會(huì)收到一條指令:“啟動(dòng)XX應(yīng)用”,這時(shí)系統(tǒng)的應(yīng)用加載器就會(huì)找到應(yīng)用程序的安裝目錄,并為應(yīng)用程序創(chuàng)建一個(gè)“進(jìn)程”,進(jìn)程創(chuàng)建后,系統(tǒng)就會(huì)利用“入口”把應(yīng)用程序的“邏輯”和“數(shù)據(jù)”加載起來(lái),并根據(jù)應(yīng)用程序的需要為進(jìn)程分配資源,如內(nèi)存、cpu等,這樣,應(yīng)用程序“運(yùn)行”的條件就滿(mǎn)足了。

進(jìn)程中會(huì)包含若干“線(xiàn)程”,這些“線(xiàn)程”共享進(jìn)程的資源,并且按照應(yīng)用程序中指定的“邏輯”完成既定的任務(wù),如啟動(dòng)閃屏,播放視頻,響應(yīng)用戶(hù)的交互操作等。

8.同步和異步

有一天,你找到公司剛來(lái)的程序員小 T,跟他說(shuō):“我們要加個(gè)需求,你放下手里的事情優(yōu)先支持,我會(huì)一直等你做完再離開(kāi)”。小 T 微笑著答應(yīng)了,眼角卻滑過(guò)一絲不易覺(jué)察的殺意。

切入正題。世界上的所有事情大致可以分為同步去做和異步去做兩種。你打電話(huà)去訂酒店,電話(huà)另一邊的工作人員需要查下他們的管理系統(tǒng)才能告訴你有沒(méi)有房間。這時(shí)候你有兩種選擇,一種是不掛電話(huà)一直等待,直到工作人員查到為止(可能幾分鐘也可能幾個(gè)小時(shí),取決于他們的辦事效率),這就是同步的。另一種是工作人員問(wèn)了你的聯(lián)系方式就掛斷了電話(huà),等他們查到之后再通知你,這就是異步的,這時(shí)候你就可以干點(diǎn)其他事情,比如把機(jī)票也定了之類(lèi)的。

同步和異步的區(qū)別就在于,在下達(dá)了執(zhí)行任務(wù)的命令后,是等到執(zhí)行完成之后才能得到結(jié)果呢,還是馬上就知道了結(jié)果(盡管是不確定的答案)。

計(jì)算機(jī)世界也是如此。我們寫(xiě)的代碼是交給CPU去執(zhí)行的,在這個(gè)過(guò)程中經(jīng)常面臨是讓CPU同步執(zhí)行還是異步執(zhí)行的選擇。比如我寫(xiě)了一個(gè)APP,它可以幫你下載網(wǎng)絡(luò)上的一個(gè)文件。當(dāng)你輸入一個(gè)文件的網(wǎng)址,按下下載按鈕的一瞬間,CPU就收到了一個(gè)下載文件的任務(wù)。

聊聊同步、異步和回調(diào)

我們先想象一下同步執(zhí)行時(shí)什么情況。CPU立刻停掉了手頭的事情,包括繪制界面、對(duì)用戶(hù)的點(diǎn)擊做出響應(yīng)等等,傾盡全力去幫你下載文件。但是,這時(shí)候你會(huì)發(fā)現(xiàn),你的屏幕再也沒(méi)有響應(yīng)了,整個(gè)系統(tǒng)就像死了一樣(廢話(huà),CPU都被你的下載任務(wù)搶走了)。過(guò)幾秒鐘,如果是Android系統(tǒng)則會(huì)彈出一個(gè)的提示,用戶(hù)非常感動(dòng),然后無(wú)情的卸載了這個(gè)APP(尼瑪褲子都脫了,你讓我看這個(gè))。同樣的情況異步執(zhí)行要好很多。CPU馬上告訴你任務(wù)已經(jīng)被受理了,等下載完成我會(huì)通知你的。于是呢,屏幕照樣刷新,用戶(hù)點(diǎn)擊都能做出處理,就好像沒(méi)有下載過(guò)一樣。然而CPU并沒(méi)有閑著,它開(kāi)啟了一個(gè)線(xiàn)程,專(zhuān)門(mén)處理這個(gè)下載任務(wù)(還記得之前講過(guò)的線(xiàn)程的概念嗎?不用擔(dān)心我們下面會(huì)詳細(xì)講)。過(guò)了幾個(gè)小時(shí)下載完了,你會(huì)收到一個(gè)通知,告訴你任務(wù)執(zhí)行的結(jié)果。

聊聊同步、異步和回調(diào)

一般情況下計(jì)算機(jī)通過(guò)多線(xiàn)程來(lái)實(shí)現(xiàn)同步,你可以把線(xiàn)程看做是富土康生產(chǎn)iPhone的一條生產(chǎn)線(xiàn)。它給生產(chǎn)一臺(tái)完整的iPhone提供了所有必須的資源:包括人力,原料,設(shè)計(jì)圖紙等等。生產(chǎn)任務(wù)來(lái)的時(shí)候,如果是同步的,那一條生產(chǎn)線(xiàn)就夠了,所有的小伙伴們蜂擁而上,不一會(huì)兒就搞定了。如果是異步的,那就必須新建一條生產(chǎn)線(xiàn)(好在CPU創(chuàng)建線(xiàn)程的成本并不高),分一部分資源到新的生產(chǎn)線(xiàn)上,這樣可以同時(shí)生產(chǎn)兩臺(tái)手機(jī)。那么生產(chǎn)線(xiàn)可以無(wú)限制增加嗎?答案是不行的。一是異步會(huì)面臨資源競(jìng)爭(zhēng)的問(wèn)題。比如說(shuō)8條生產(chǎn)線(xiàn)都要組裝電池,但是電池原料只有4份,那么必然會(huì)存在其他4條生產(chǎn)線(xiàn)等待的其情況,如果資源競(jìng)爭(zhēng)比較頻繁,甚至異步的執(zhí)行效率要低于同步。二是異步會(huì)導(dǎo)致?tīng)顟B(tài)難以管理。比如車(chē)間主任想要統(tǒng)計(jì)一共生產(chǎn)了多少iPhone,就必須要詢(xún)問(wèn)完所有生產(chǎn)線(xiàn)才能得出結(jié)論,而且這個(gè)詢(xún)問(wèn)過(guò)程必須要停掉所有的生產(chǎn)線(xiàn),同步來(lái)做。

講到這里,回調(diào)的概念呼之欲出。上面異步任務(wù)的整個(gè)過(guò)程是首先你要把自己的信息給異步任務(wù)執(zhí)行者,等執(zhí)行完成的時(shí)候,執(zhí)行者可以通過(guò)這些信息找到你,并給你一個(gè)通知。把自己信息給別人的過(guò)程叫做注冊(cè),別人找到你給你通知的過(guò)程就叫做回調(diào)。上面的例子,你把自己的聯(lián)系方式給了酒店工作人員叫做注冊(cè),工作人員完成任務(wù)后聯(lián)系你叫做回調(diào)。但是回調(diào)的概念其實(shí)非常廣,這里可以抽象成先把要做的事情注冊(cè)給別人,等條件滿(mǎn)足的時(shí)候別人再回過(guò)頭來(lái)調(diào)用你的模型。程序上響應(yīng)一個(gè)按鈕點(diǎn)擊之后要做的事情也是用回調(diào)來(lái)做的。程序員先把用戶(hù)點(diǎn)了按鈕要做的事情先寫(xiě)好(比如要下載文件),注冊(cè)給系統(tǒng)。等用戶(hù)點(diǎn)擊到按鈕的時(shí)候,系統(tǒng)就會(huì)回調(diào)你下載文件的代碼。

回到前文,了解了同步、異步以及回調(diào)之后,你會(huì)這樣跟小 T 說(shuō):” 我們要加個(gè)需求,你抽時(shí)間支持下,等你做完了記得通知我?!靶?T 欣然接受,眼角閃過(guò)理解萬(wàn)歲的淚光,回頭就把這事兒忘了。

9.渲染

計(jì)算機(jī)、瀏覽器、手機(jī)app的渲染道理一模一樣,你在顯示器上看到的一切也都經(jīng)歷了類(lèi)似的過(guò)程,大致分為三步:測(cè)量、排版、繪制。拿支付寶手機(jī)App舉例,我們進(jìn)入界面之后看到了那么多按鈕或TAB,計(jì)算機(jī)是如何知道哪個(gè)按鈕該擺在何處,應(yīng)該多寬多高,以及程序啟動(dòng)的時(shí)候應(yīng)該是呈現(xiàn)出什么樣子呢?

當(dāng)我們談?wù)搫?dòng)畫(huà)的時(shí)候,我們?cè)谡務(wù)撌裁? /></p>
<p>計(jì)算機(jī)里面存儲(chǔ)的全部是01組成的串(這些串既有程序代碼也有相應(yīng)的數(shù)據(jù)),他們靜靜的躺在你的硬盤(pán)或sd卡中,當(dāng)你點(diǎn)擊手機(jī)app上的支付寶圖標(biāo)的時(shí)候,這個(gè)時(shí)候存儲(chǔ)設(shè)備中的代碼和數(shù)據(jù)迅速被載入內(nèi)存,并加載執(zhí)行。當(dāng)程序運(yùn)行到構(gòu)造界面的時(shí)候,這個(gè)時(shí)候計(jì)算機(jī)像畫(huà)家一樣開(kāi)始測(cè)量,每一個(gè)按鈕的寬高(其中是有一大堆算法或者說(shuō)規(guī)則在默默的計(jì)算,比如一個(gè)按鈕在另一個(gè)上方,如何不和其他的按鈕重疊等等)。知道了多寬多高之后,計(jì)算機(jī)開(kāi)始計(jì)算每一個(gè)按鈕應(yīng)該擺在屏幕上的什么位置。大小、位置都明確之后,計(jì)算機(jī)開(kāi)始繪制,也就是把相應(yīng)的顏色或者圖片資源從CPU輸送到顯卡,顯卡把這些數(shù)據(jù)發(fā)送給顯示器的緩沖區(qū),屏幕的下一次刷新將這些新數(shù)據(jù)更新到顯示器上,整個(gè)渲染(呈現(xiàn))過(guò)程結(jié)束。</p>
<p>說(shuō)了很多廢話(huà),想說(shuō)清楚的是,渲染是通過(guò)一些列計(jì)算并呈現(xiàn)的過(guò)程,其中包括測(cè)量、排版、繪制。你在任何屏幕上看到的任何一個(gè)圖形,無(wú)一例外,都經(jīng)過(guò)了這三個(gè)過(guò)程。下次和程序界的朋友溝通展示慢,頓問(wèn)題的時(shí)候,你可以很隨意的說(shuō)句,感覺(jué)整個(gè)渲染過(guò)程不是很流暢,保證你們的交流會(huì)很得心應(yīng)手。</p>
<h3>10.QQ快的原因</h3>
<p><b>(1)QQ會(huì)在用戶(hù)上傳、下載圖片等連接服務(wù)器操作時(shí),結(jié)合其網(wǎng)絡(luò)情況選擇周邊最快的</b><b>服務(wù)器;</b></p>
<p><b>(2)QQ會(huì)對(duì)用戶(hù)每天使用的網(wǎng)絡(luò)進(jìn)行記錄和分析,預(yù)測(cè)出用戶(hù)在哪個(gè)時(shí)段可能用哪個(gè)網(wǎng)</b><b>絡(luò)(如3G/4G/WIFI),并在相應(yīng)時(shí)段自動(dòng)連接相應(yīng)情況下最優(yōu)的服務(wù)器;</b></p>
<p><b>(3)圖片下載優(yōu)化:</b></p>
<ol>
<li>漸進(jìn)傳輸:先傳輸圖片部分?jǐn)?shù)據(jù)和像素模糊顯示,后續(xù)再將剩余數(shù)據(jù)和像素傳輸完成從而清晰顯示;</li>
<li>圖片轉(zhuǎn)碼:同等圖片質(zhì)量下圖片更小的編碼技術(shù);</li>
<li>圖片適配:較慢網(wǎng)絡(luò)如2G或較低像素終端情況下,下載較低質(zhì)量但更小的圖片,前者為提高速度,后者為節(jié)省流量;</li>
<li>預(yù)加載:為方便用戶(hù)快速打開(kāi)而預(yù)加載一些大圖,可通過(guò)銀行家算法加以控制,用戶(hù)看了的話(huà)就加載對(duì)了,沒(méi)看的話(huà)就說(shuō)明無(wú)效加載了,累計(jì)的無(wú)效加載到一定閥值就不再進(jìn)行預(yù)加載。</li>
</ol>
<h3>11.圖片資源處理</h3>
<p>相信廣大的產(chǎn)品經(jīng)理同學(xué)肯定希望自己的產(chǎn)品UI能夠美美的,讓用戶(hù)們賞心悅目。要做到這一點(diǎn),主要就靠咱們偉大的視覺(jué)設(shè)計(jì)師出的各種圖片資源。小到應(yīng)用程序的圖標(biāo)或者按鈕,大到啟動(dòng)時(shí)的閃屏,無(wú)不是出自設(shè)計(jì)師之手。當(dāng)圖片被打包到程序中后,他們就被正式的賦予了為廣大用戶(hù)謀眼福的使命。</p>
<p>然而,圖片的大小是固定的,而使用圖片的設(shè)備分辨率卻千變?nèi)f化。比如一張1280×720分辨率的全屏閃屏圖片,可能會(huì)被加載到1080P、720P、480P甚至320P的設(shè)備上,除了720P的設(shè)備外,在其他三款設(shè)備上1280×720的圖片都會(huì)產(chǎn)生“縮放”。我們都知道,圖片的內(nèi)容都是由像素組成的,比如1280×720的圖片由921,600個(gè)像素構(gòu)成,720P的顯示設(shè)備屏幕上也正好是921,600個(gè)像素,這樣圖片的每一個(gè)點(diǎn)都可以與屏幕上的點(diǎn)一一對(duì)應(yīng),進(jìn)而完美的呈現(xiàn)圖片的細(xì)節(jié)。480P乃至320P的設(shè)備,他們屏幕上的像素點(diǎn)個(gè)數(shù)遠(yuǎn)遠(yuǎn)小于921,600(480P設(shè)備38萬(wàn)個(gè)像素點(diǎn),320P設(shè)備15萬(wàn)個(gè)像素點(diǎn)),屏幕上的像素?zé)o法做到與1280×720圖片像素的一一對(duì)應(yīng),這種情況下,為了讓低像素?cái)?shù)的屏幕能夠完全呈現(xiàn)高像素?cái)?shù)圖片的內(nèi)容,圖片的一些細(xì)節(jié)(像素)就會(huì)被丟棄,以480P的設(shè)備為例,1280×720的圖片就會(huì)被顯示成800×480個(gè)像素,圖片看起來(lái)被“縮小”了,也就是系統(tǒng)對(duì)圖片進(jìn)行了“縮放”。這種“尺寸”(分辨率)從大到小的縮放會(huì)丟失一些細(xì)節(jié)。</p>
<p>當(dāng)1280×720的圖片被加載到1080P(207萬(wàn)像素)時(shí),情況就更糟了。我們期望自己的圖片可以占滿(mǎn)用戶(hù)的屏幕,但是即便把圖片中的每一個(gè)像素都一一對(duì)應(yīng)的填充到屏幕上,還是會(huì)有一半的像素沒(méi)有內(nèi)容,這種效果大家可以想象。不過(guò)好在聰明的軟件工程師們?cè)缇蛯?shí)現(xiàn)了一系列的方法來(lái)讓大家避免陷入這種圖片被“放大”或“縮小”后圖片質(zhì)量變差的窘境,這些方法被叫做“插值算法”。</p>
<p>顧名思義,“插值算法”就是在原有的像素值基礎(chǔ)上,插入或修改一些像素值,并盡最大可能保證原圖的特征。當(dāng)前比較流行的插值算法主要有“鄰近插值”和“雙線(xiàn)性插值”,具體的算法這里不再冗述,感興趣的同學(xué)可以在網(wǎng)上隨處搜到。</p>
<p>通過(guò)上面兩段的描述,我們可以看到,當(dāng)圖片的內(nèi)容無(wú)法與屏幕上的像素點(diǎn)進(jìn)行一一對(duì)應(yīng)的時(shí)候,就會(huì)產(chǎn)生“縮放”,雖然當(dāng)前有一些手段可以盡量的避免縮放對(duì)圖片質(zhì)量造成的影響,但顯示效果或多或少都會(huì)收到影響,并且縮放的程度越大,效果損失的越嚴(yán)重。所以有的系</p>
<p>統(tǒng)會(huì)提供另外的機(jī)制盡量避免“縮放”的產(chǎn)生,或者把“縮放”帶來(lái)的副作用降低到最小。比如安卓系統(tǒng)就為應(yīng)用程序的圖片資源定義了一組文件夾,每個(gè)文件夾對(duì)應(yīng)一種屏幕的像素密度/分辨率,在不同像素密度/分辨率的設(shè)備上從對(duì)應(yīng)的文件夾中取圖片資源,盡量的減少或避免“縮放”,進(jìn)而最大化的還原設(shè)計(jì)師們的原始設(shè)計(jì)。</p>
<h3>12.Cookie和廣告聯(lián)盟</h3>
<p>相信大家都有相同的經(jīng)歷,在瀏覽網(wǎng)頁(yè)的時(shí)候,有的廣告竟然知道我近期搜索過(guò)的關(guān)鍵詞,也有一些廣告竟然知道我近期要買(mǎi)的東西。那到底是什么東西悄悄的把我們的信息出賣(mài)了呢?答案就是本文的主角:Cookie。</p>
<p>之前的文章講過(guò)我們?yōu)g覽一個(gè)網(wǎng)頁(yè)的時(shí)候,瀏覽器在做什么事情。它不斷的向服務(wù)器請(qǐng)求數(shù)據(jù),服務(wù)器不斷的回答數(shù)據(jù)。但是這個(gè)過(guò)程有個(gè)缺點(diǎn),就是每次請(qǐng)求都是獨(dú)立的,服務(wù)器并不會(huì)記下客戶(hù)端的信息。打個(gè)比方說(shuō),你每天都去樓下馬大姐那里吃烤串兒,但是馬大姐記性不好,你一走她就不認(rèn)識(shí)你了。這時(shí)候你就想,如果我每次去吃烤串的時(shí)候,主動(dòng)給馬大姐提供一些自己的身份信息,說(shuō)不定還能打個(gè)折呢。這個(gè)身份信息,在技術(shù)上就叫做Cookie。</p>
<p>Cookie是瀏覽器每次向網(wǎng)站服務(wù)器請(qǐng)求數(shù)據(jù)的時(shí)候,攜帶的一些額外信息,這些信息一般非常少(最多4KB),主要就是為了解決服務(wù)器記性不好的問(wèn)題。當(dāng)然Cookie究竟需要攜帶什么信息,其實(shí)是由服務(wù)器決定的,比如你登錄了新浪微博之后,服務(wù)器就會(huì)要求瀏覽器把你的賬號(hào)寫(xiě)到Cookie里,下次你請(qǐng)求你的關(guān)注列表,瀏覽器就會(huì)帶上這個(gè)Cookie,一起發(fā)送到服務(wù)器,這樣服務(wù)器就會(huì)知道你是誰(shuí)了。</p>
<p>Cookie每個(gè)網(wǎng)站都會(huì)有很多,但它們是隔離開(kāi)的。也就是說(shuō),百度只能訪問(wèn)到百度存在瀏覽器的Cookie,微博只能訪問(wèn)到微博存在瀏覽器的Cookie,百度是拿不到微博的Cookie的,這一點(diǎn)由瀏覽器保證。</p>
<p>現(xiàn)在我們來(lái)看下開(kāi)頭廣告的事情。我們的搜索關(guān)鍵詞被百度保存在了瀏覽器的Cookie里,但是這個(gè)廣告是出現(xiàn)在一個(gè)博客網(wǎng)站上的,按上文的理論,這個(gè)博客網(wǎng)站只能訪問(wèn)到它自己存在我們?yōu)g覽器的Cookie,為什么能訪問(wèn)到百度的Cookie呢?這時(shí)我不禁想起程序界有一位祖師爺?shù)慕逃?xùn):你所有的痛苦和困惑,都可以從源代碼里找到答案(read the?fucking source code)。小弟看了下這個(gè)頁(yè)面源碼后,發(fā)現(xiàn)廣告其實(shí)是博客網(wǎng)站的程序員從百度那里拿了一段代碼放到自己的頁(yè)面上,用戶(hù)在請(qǐng)求廣告圖片的時(shí)候,還是去百度請(qǐng)求的,自然百度也就能拿到帶著搜索關(guān)鍵詞的Cookie了。拿到Cookie的百度就可以根據(jù)關(guān)鍵詞匹配他們的廣告推薦給你,這種廣告因?yàn)橥扑偷亩际怯脩?hù)感興趣的內(nèi)容,殺傷力特別大,被稱(chēng)為精準(zhǔn)廣告。</p>
<p>成千上萬(wàn)的網(wǎng)站加入了搜索引擎的廣告聯(lián)盟,這樣你在瀏覽其他網(wǎng)站的時(shí)候,都會(huì)看到帶有自己關(guān)鍵詞的廣告,哪天你搜索了一些不想讓人知道的東西,嘿嘿,這些廣告就會(huì)跳出來(lái)出賣(mài)你。</p>
<h3>13.動(dòng)畫(huà)原理</h3>
<p>我們先來(lái)說(shuō)幾個(gè)簡(jiǎn)單的概念。動(dòng)畫(huà)過(guò)程中的某一張靜止畫(huà)面叫做一幀(Frame),一個(gè)動(dòng)畫(huà)每秒鐘播放的幀數(shù)叫做幀率(單位是FPS),一般來(lái)說(shuō)當(dāng)幀率達(dá)到30幀每秒的時(shí)候,人們就會(huì)覺(jué)得這個(gè)動(dòng)畫(huà)很連貫了,當(dāng)幀率達(dá)到60幀每秒的時(shí)候,這個(gè)動(dòng)畫(huà)就會(huì)非常流暢了。像下面這個(gè)點(diǎn)擊按鈕彈出菜單的動(dòng)畫(huà),要達(dá)到每秒鐘60幀的幀率流暢運(yùn)行,每一幀要花多久來(lái)展示呢?如果我沒(méi)算錯(cuò)的話(huà),應(yīng)該是16毫秒左右。</p>
<p>16毫秒,也就是留給是你的手機(jī)渲染一幀的時(shí)間。還記得我們之前講過(guò)的渲染的概念嗎?在這16毫秒期間,你需要為屏幕上的所有圖片、按鈕、文字測(cè)量好大小,排布好位置,然后交給顯卡繪制出來(lái)。現(xiàn)在手機(jī)配置越來(lái)越強(qiáng)大,但是屏幕分辨率也越來(lái)越大。分辨率越大意味著每一幀要畫(huà)的像素越多,CPU和顯卡的負(fù)擔(dān)也越重。這時(shí)候萬(wàn)一哪個(gè)2B程序員插了一段從網(wǎng)絡(luò)上同步下載蒼老師.avi的代碼進(jìn)去,導(dǎo)致每一幀繪制都需要100多毫秒,這時(shí)候用戶(hù)就會(huì)看到動(dòng)畫(huà)一卡一卡的,這個(gè)用戶(hù)多半是要流失了。</p>
<p>那么從技術(shù)上來(lái)講如何實(shí)現(xiàn)一個(gè)動(dòng)畫(huà)呢?這里需要操作系統(tǒng)提供三個(gè)東西,一個(gè)是刷新屏幕的命令,我們假設(shè)叫refresh,我們的程序發(fā)出了這個(gè)命令后,手機(jī)就會(huì)刷新一次屏幕。另一個(gè)是繪制圖形的命令,假設(shè)叫drawFrame,這個(gè)是一個(gè)代表,具體可以是drawCircle(在屏幕上畫(huà)個(gè)圓圈)、drawRect(畫(huà)個(gè)長(zhǎng)方形)、drawText(畫(huà)一段文字)等等。最后一個(gè)是定時(shí)器,假設(shè)叫scheduleNextFrame,它的作用是告訴操作系統(tǒng)下一幀的時(shí)間。</p>
<p><b>假設(shè)我們要繪制一個(gè)500毫秒的動(dòng)畫(huà),它展示一個(gè)圓放大30倍的動(dòng)畫(huà)過(guò)程。程序員會(huì)這樣</b></p>
<ul>
<li>寫(xiě)程序:</li>
<li>動(dòng)畫(huà)開(kāi)始:</li>
<li>第一幀:drawCircle(1倍)—>refresh—>scheduleNextFrame</li>
<li>第二幀: drawCircle(2倍)—>refresh—>scheduleNextFrame</li>
<li>第三幀: drawCircle(3倍)—>refresh—>scheduleNextFrame</li>
<li>…</li>
<li>第30幀: drawCircle(30倍)—>refresh</li>
<li>動(dòng)畫(huà)結(jié)束。</li>
</ul>
<p>這種動(dòng)畫(huà)實(shí)現(xiàn)起來(lái)非常簡(jiǎn)單,iOS和Android都內(nèi)置了幾種常見(jiàn)動(dòng)畫(huà)類(lèi)型,如縮放、平移、漸變、旋轉(zhuǎn)等等。程序員只需要設(shè)置好動(dòng)畫(huà)時(shí)長(zhǎng)(前面的500毫秒),動(dòng)畫(huà)中要變化的東西(前面放大多少倍),然后發(fā)出start的命令就可以了。</p>
<p>還有一種動(dòng)畫(huà)叫有交互的動(dòng)畫(huà)。它由用戶(hù)手指的操作觸發(fā)刷新屏幕,一個(gè)典型的場(chǎng)景是我們滑動(dòng)朋友圈列表的時(shí)候,列表之所以跟著手指動(dòng),就是因?yàn)槭种傅囊苿?dòng)觸發(fā)了屏幕的刷新。這個(gè)場(chǎng)景延伸出去就是游戲了,游戲的界面刷新也是由用戶(hù)控制的。從實(shí)現(xiàn)成本上來(lái)說(shuō),程序要要實(shí)現(xiàn)一個(gè)沒(méi)有交互的動(dòng)畫(huà)很簡(jiǎn)單的,如果動(dòng)畫(huà)不是特別復(fù)雜,基本上從設(shè)計(jì)師那里拿到資源和設(shè)計(jì)稿,就可以大概做出個(gè)雛形。有交互的動(dòng)畫(huà)因?yàn)橐幚碛脩?hù)手指的觸摸事件,會(huì)稍微麻煩一點(diǎn),但基本原理都是相通的。</p>
<h2  id=二、服務(wù)端相關(guān)

1. 302狀態(tài)碼

在互聯(lián)網(wǎng)世界里面,已經(jīng)存在數(shù)億量級(jí)的網(wǎng)頁(yè),如何管理及標(biāo)識(shí)每一個(gè)網(wǎng)頁(yè)以及方便瀏覽器尋址到此網(wǎng)頁(yè)并展示呢?其中,每個(gè)網(wǎng)頁(yè)都對(duì)應(yīng)著一個(gè)URL(Uniform?ResourceLocation)地址,也叫網(wǎng)址,類(lèi)似于一個(gè)真實(shí)世界中的門(mén)牌地址一樣,真實(shí)世界中標(biāo)識(shí)了物理地址(如北京市朝陽(yáng)區(qū)某小區(qū)張大媽家的門(mén)牌號(hào))。同樣道理,網(wǎng)址標(biāo)識(shí)了一個(gè)web頁(yè)面所在的互聯(lián)網(wǎng)里面的真實(shí)地址(這個(gè)頁(yè)面處于www.baidu.com/file/1.html,處于baidu服務(wù)器file路徑下的1這個(gè)文件)。

當(dāng)你用瀏覽器點(diǎn)擊一個(gè)頁(yè)面鏈接的時(shí)候,隨即你看到了一個(gè)新的網(wǎng)頁(yè)展示在瀏覽器內(nèi),在這個(gè)過(guò)程中,瀏覽器其實(shí)是在不斷的接收服務(wù)器端的應(yīng)答(這個(gè)應(yīng)答是服務(wù)器端的狀態(tài),所以返回碼叫狀態(tài)碼),從而來(lái)決策下一步來(lái)做什么(盡管大部分情況下,你毫無(wú)感知的就打開(kāi)了你想要的頁(yè)面),這個(gè)應(yīng)答即狀態(tài)碼(status code),在http協(xié)議里面,以三位數(shù)標(biāo)識(shí),共分為五類(lèi):分別為1××,2××,3××,4××,5××。一些常用狀態(tài)碼如下所示:

給產(chǎn)品經(jīng)理講技術(shù)丨什么是HTTP 302跳轉(zhuǎn)?

301和302表示重定向,301表示這個(gè)網(wǎng)頁(yè)已經(jīng)永久的由服務(wù)器的A路徑下移動(dòng)到路徑B下,而302表示臨時(shí)移動(dòng)到B路徑下,對(duì)應(yīng)到Url地址也即http://baidu.com/file/A/1.html到http://baidu.com/file/B/1.html,當(dāng)瀏覽器訪問(wèn)前面一個(gè)地址的時(shí)候,這個(gè)時(shí)候服務(wù)器會(huì)告知瀏覽器,請(qǐng)到B路徑下獲取這個(gè)文件,隨后瀏覽器重新發(fā)起網(wǎng)絡(luò)請(qǐng)求,請(qǐng)求B路徑下的頁(yè)面,經(jīng)過(guò)渲染,呈現(xiàn)給用戶(hù),例如淘寶的例子,請(qǐng)求taobao.com,收到302,從而瀏覽器再次請(qǐng)求www.taobao.com獲得頁(yè)面內(nèi)容。

2.升級(jí)及下載加速原理

升級(jí)檢測(cè)和升級(jí)方式

動(dòng)檢測(cè)或者用戶(hù)點(diǎn)擊檢查更新以后,會(huì)像云端檢索最新的版本號(hào),md5等等。然后與本地的版本號(hào)核對(duì)。若一致,則告訴用戶(hù)”您正在使用的是最新版本“若不一致,就下載最新版本。這兒分兩種。

一種是全部下載。換句話(huà)說(shuō)就和你當(dāng)初安裝這個(gè)軟件出不多,只是下載那步他幫你完成了。數(shù)據(jù)也得到了保留。

一種是增量升級(jí)。其實(shí)增量升級(jí)的原理很簡(jiǎn)單,即首先將應(yīng)用的舊版本Apk與新版本Apk做差分,得到更新的部分的補(bǔ)丁,例如舊版本的APK有5M,新版的有8M,更新的部分則可能只有3M左右(這里需要說(shuō)明的是,得到的差分包大小并不是簡(jiǎn)單的相減,因?yàn)槠鋵?shí)需要包含一些上下文相關(guān)的東西),使用差分升級(jí)的好處顯而易見(jiàn),那么你不需要下載完整的8M文件,只需要下載更新部分就可以,而更新部分可能只有3、4M,可以很大程度上減少流量的損失。

增量更新原因

增量更新對(duì)于版本更新不是很頻繁的軟件來(lái)說(shuō)還可以,但對(duì)于更新較頻繁的軟件,使用增量更新每更新一次工作量都會(huì)很大,因?yàn)槟阈枰紤]各個(gè)版本升級(jí)到最新版本的兼容性問(wèn)題。比如一個(gè)APP有V1.0、V1.1、V1.2、V1.3、V1.4、V1.5幾個(gè)版本,現(xiàn)在有V2.0需要發(fā)布,如果做增量升級(jí)的話(huà)需要做之前每個(gè)版本升級(jí)到V2.0的差分包,因?yàn)槟悴荒鼙WC用戶(hù)手中的APP都是V1.5版本,這對(duì)于測(cè)試驗(yàn)證來(lái)說(shuō)工作量太大了,并且管理起來(lái)也很麻煩。

升級(jí)離線(xiàn)下載原理

假如,你現(xiàn)在要下載QQ,普通下載,使用普通下載(瀏覽器),只能從騰訊服務(wù)器下載,并且只有一條下載路徑。就好比上學(xué)的時(shí)候缺錢(qián),只能從老爸手上要錢(qián)。如果你使用迅雷下載,就有機(jī)會(huì)同時(shí)獲得以下幾種加速方式:

多線(xiàn)程下載(免費(fèi))

依舊只能從騰訊服務(wù)器下載,但是能夠獲得多條下載路徑,提升下載速度。

偶然知道生活拮據(jù),姑姑伯伯舅舅開(kāi)始偷偷塞錢(qián)給你,你手中的現(xiàn)金開(kāi)始富余。

P2S下載(免費(fèi))

P2S=Point to Server點(diǎn)對(duì)服務(wù)器

除了多線(xiàn)程下載之外,迅雷支持從全網(wǎng)的其他有QQ軟件的服務(wù)器下載,比如金山服務(wù)器等等,提升下載速度。

后來(lái)你認(rèn)識(shí)了富二代的朋友,他們時(shí)不時(shí)請(qǐng)你吃飯,給你買(mǎi)單,你幾乎不用從老爸(原始地址)那里要錢(qián)了。

P2P下載(免費(fèi))

p2p=Peer to Peer點(diǎn)對(duì)點(diǎn)

有了多線(xiàn)程和P2S加速之后,當(dāng)其他用戶(hù)同時(shí)在下載QQ時(shí),你也可以直接從對(duì)方PC下載,而不用經(jīng)過(guò)服務(wù)器。(目前手機(jī)暫不支持P2P)

再后來(lái),你有能力了,開(kāi)始計(jì)劃創(chuàng)業(yè)了,幾個(gè)天使投資人對(duì)你感興趣,給你投資,你再也不用找家里人要錢(qián)。

會(huì)員高速CDN下載(迅雷會(huì)員)

CDN=Content Delivery Network內(nèi)容分發(fā)網(wǎng)絡(luò)

通過(guò)購(gòu)買(mǎi)服務(wù)器,迅雷在用戶(hù)下載的同時(shí),把文件快速下載到迅雷服務(wù)器(強(qiáng)大的帶寬和網(wǎng)速),用戶(hù)再?gòu)木嚯x最近的迅雷服務(wù)器進(jìn)行下載(從迅雷服務(wù)器到迅雷客戶(hù)端的下載速度極快)。

然后你公司慢慢做大做強(qiáng),幾個(gè)大型的投資機(jī)構(gòu),如日本軟銀、紅杉資本又給你注入了資金,你已經(jīng)向高富帥邁進(jìn)了!

DCDN加速(迅雷會(huì)員)

DCDN=CDN 2.0

用戶(hù)通過(guò)協(xié)議之后,迅雷會(huì)把相關(guān)資源片段存儲(chǔ)在用戶(hù)PC,把每一臺(tái)PC都當(dāng)成服務(wù)器,其他用戶(hù)下載QQ時(shí),可以獲得極快下載速度。在此過(guò)程中,迅雷須向提供存儲(chǔ)空間的用戶(hù)付費(fèi),作為對(duì)用戶(hù)的一種補(bǔ)償。

最后,突然發(fā)現(xiàn)巴菲特是你失散多年的干爹!于是,化身高富帥,贏取白富美,你登上了人生巔峰?。?!

以上是迅雷加速的幾種原理,用戶(hù)能夠獲得遠(yuǎn)遠(yuǎn)高于原始下載的速度,這也是迅雷下載如此迅速的原因。

3.代理服務(wù)器

代理就是代為處理的意思,現(xiàn)實(shí)生活中有很多事情我們不想自己親自動(dòng)手,就花點(diǎn)錢(qián)找個(gè)代理擺平,說(shuō)的就是這個(gè)意思。這年頭,各種各樣的代理都有。你看到別人名片上寫(xiě)著阿迪王北京總代理,就應(yīng)該知道他是替阿迪王公司賣(mài)鞋的;看到有人喜當(dāng)?shù)?,就?yīng)該知道他是在替別人的孩子當(dāng)爸爸。他們有個(gè)共同特點(diǎn),就是代理和本人干的是一樣的事情,外人很難分辨出來(lái)。

切入正題,今天我們要講的代理服務(wù)器,是指在我們上網(wǎng)的過(guò)程中訪問(wèn)某個(gè)服務(wù)器的時(shí)候,并不是親自訪問(wèn)真正的服務(wù)器,而是先找了一個(gè)代理,由它向真正的服務(wù)器發(fā)出請(qǐng)求。到這里各位看官應(yīng)該明白了,代理服務(wù)器架在客戶(hù)端和真正服務(wù)器中間,干的是替客戶(hù)端訪問(wèn)真正服務(wù)器的工作。

那么這里有人要說(shuō)了,不對(duì)啊,小學(xué)語(yǔ)文老師教過(guò)我們兩點(diǎn)之間線(xiàn)段最短,為什么你們不直接去真正服務(wù)器拿數(shù)據(jù),還要到代理服務(wù)器里繞個(gè)路呢?這里可能有幾種情況:一是真正的服務(wù)器藏于千里之外,我們連接不上。二是我們?cè)L問(wèn)真正的服務(wù)器的速度太慢,比不上我們?cè)L問(wèn)代理服務(wù)器+代理服務(wù)器訪問(wèn)真正服務(wù)器的速度。還有一種情況,就是通過(guò)代理服務(wù)器訪問(wèn)真正服務(wù)器可以隱藏訪問(wèn)者的身份,保護(hù)訪問(wèn)者。同理,我們?cè)诰W(wǎng)絡(luò)世界中一定要懂得保護(hù)自己,一次看似不經(jīng)意的瀏覽,背后可能有好多雙眼睛在盯著你。他們可以通過(guò)各種途徑查到你的IP地址,然后上門(mén)找到你。所以請(qǐng)記住一句話(huà),代理用的好,不怕查水表。

光說(shuō)理論太枯燥,我們看幾個(gè)例子。下面的截圖是我們通過(guò)百度搜索點(diǎn)開(kāi)了一個(gè)網(wǎng)站,上面提示“原網(wǎng)頁(yè)已由百度轉(zhuǎn)碼,已方便在移動(dòng)設(shè)備上查看”。也就是說(shuō),這時(shí)候我們?cè)L問(wèn)的并不是這個(gè)網(wǎng)站真正的服務(wù)器,而是百度提供的代理服務(wù)器。這個(gè)代理服務(wù)器把真正服務(wù)器的內(nèi)容返回給我們的時(shí)候,把原網(wǎng)頁(yè)的內(nèi)容改成了現(xiàn)在這個(gè)樣子,“順便”還插入了自己的廣告(下方紅框)。

現(xiàn)在很多手機(jī)瀏覽器都有省流加速功能,其實(shí)就是通過(guò)代理服務(wù)器來(lái)達(dá)到節(jié)省流量的目的。假如我要訪問(wèn)的原網(wǎng)頁(yè)A需要800K的流量,但是我開(kāi)啟了省流加速功能后,瀏覽器會(huì)幫我自動(dòng)連接上A的代理服務(wù)器B,B從A拿到真正的數(shù)據(jù)后,進(jìn)行一些數(shù)據(jù)的壓縮操作,那么我再訪問(wèn)代理服務(wù)器B的時(shí)候,可能只需要100K就可以瀏覽網(wǎng)頁(yè)A的內(nèi)容了。

4.輕量級(jí)虛擬機(jī)–DOCKER

軟件開(kāi)發(fā)中需要面對(duì)的一個(gè)挑戰(zhàn)就是環(huán)境管理問(wèn)題,因?yàn)檐浖⒉皇仟?dú)立運(yùn)行的,它依賴(lài)了很多其它的軟件,包括操作系統(tǒng)、運(yùn)行時(shí)、依賴(lài)庫(kù)等等,而且對(duì)每個(gè)依賴(lài)軟件還有版本要求,有一個(gè)依賴(lài)關(guān)系稍微不對(duì),那就可能造成軟件的運(yùn)行異常。產(chǎn)品同學(xué)應(yīng)該有過(guò)這種經(jīng)歷,從開(kāi)發(fā)哥那里要一個(gè)最新版的軟件來(lái)體驗(yàn)功能,結(jié)果裝在自己的電腦上打開(kāi)就掛掉,這個(gè)時(shí)候找開(kāi)發(fā)哥來(lái)解決,開(kāi)發(fā)哥一看就會(huì)說(shuō)“哦,你這環(huán)境不對(duì),換個(gè)Win8吧,這軟件只能在Win8以上運(yùn)行”,或者說(shuō)“這個(gè)軟件需要.Net框架,你裝個(gè).Net就好了”。

Docker,改變程序世界的箱子

其實(shí)解決依賴(lài)環(huán)境的辦法很簡(jiǎn)單,那就是所有機(jī)器都用同一套環(huán)境。但是對(duì)于一些web服務(wù),它所依賴(lài)的軟件及關(guān)聯(lián)軟件可能有上百個(gè),讓你去配一臺(tái)機(jī)器已經(jīng)要吐血了,如果讓你把這個(gè)服務(wù)發(fā)布到100臺(tái)不同的機(jī)器上,那么你就應(yīng)該會(huì)陣亡了。同時(shí),很有可能因?yàn)椴煌臋C(jī)器已有的環(huán)境不同,你安裝這些依賴(lài)的同時(shí)還要保證不能影響其它已有應(yīng)用。

說(shuō)了這么多,其實(shí)就是三個(gè)大問(wèn)題,如何解決環(huán)境依賴(lài)?如何解決大規(guī)模部署?如何解決應(yīng)用與應(yīng)用的互相影響?Docker就是這些問(wèn)題的一種解決方案,它是一個(gè)容器,也可以說(shuō)是一個(gè)軟件集裝箱,這個(gè)箱子里面可以塞入特定版本的操作系統(tǒng)、數(shù)據(jù)庫(kù)、服務(wù)器程序和web應(yīng)用,這樣一套完整的web服務(wù)就集成在這個(gè)箱子里面了,當(dāng)要發(fā)布服務(wù)的時(shí)候,直接將這個(gè)集裝箱放在我們的服務(wù)器船上。如果你想發(fā)布到100臺(tái)機(jī)器上,沒(méi)問(wèn)題,只需要ctrl-c、ctrl-v,將這些集裝箱復(fù)制到100臺(tái)機(jī)器上,它不會(huì)在乎船的配置高低,只要能放得下就行。

如果你想發(fā)布10個(gè)不同的服務(wù),還是沒(méi)問(wèn)題,你只需將這10個(gè)不同的集裝箱依次排列在服務(wù)器船上,它們之間完全不會(huì)互相影響,因?yàn)楦髯员绘i在不同的箱子里。

有的同學(xué)可能會(huì)說(shuō)了,這不就是虛擬機(jī)嘛…是的,Docker算是一種輕量級(jí)的虛擬機(jī),它比起傳統(tǒng)的虛擬機(jī)更快,更節(jié)省資源。打個(gè)比方,虛擬機(jī)就是輪船上的豪華包間,即使它用不了這么多資源,它也霸占著不讓別人使用,而Docker容器就是一個(gè)簡(jiǎn)單的集裝箱,它只占據(jù)它需要的資源。

三、交互相關(guān)

1.網(wǎng)頁(yè)與原生App如何交互

想想平時(shí)用的 App,你非常確信在瀏覽一個(gè)網(wǎng)頁(yè),然而需要登錄時(shí),它卻喚起了你手機(jī)里的 QQ 或是微信,你不再需要輸入帳號(hào)和密碼就可以讓你瀏覽的網(wǎng)頁(yè)獲取你的登錄信息,這一切只發(fā)生在你指尖的兩次點(diǎn)擊。

網(wǎng)頁(yè)與原生 app 如何交互

而在手機(jī)上,網(wǎng)頁(yè)越來(lái)越炫酷,你都很難區(qū)分你在點(diǎn)擊的是一個(gè)原生界面(指 Native 應(yīng)用程序,說(shuō)人話(huà)就是 android app 或 ios 應(yīng)用)或僅僅是一個(gè) H5 頁(yè)面。你的操作一直穿梭在網(wǎng)頁(yè)與原生界面之間,比如一個(gè)網(wǎng)頁(yè)中的電話(huà)號(hào)碼,點(diǎn)擊就可以撥打電話(huà),這種網(wǎng)頁(yè)和 app 交互這一切是如何實(shí)現(xiàn)的呢?

這項(xiàng)能力在安卓中叫做Js2Java(ios上也提供類(lèi)似的技術(shù)),很好理解,從Js到Java,從網(wǎng)頁(yè)到app,他們是雙向通信,可互相調(diào)用的,市面上大量的App程序,都在利用這項(xiàng)技術(shù),微信更是本質(zhì)上利用這項(xiàng)技術(shù)打造了公眾帳號(hào)整個(gè)體系,使得創(chuàng)業(yè)者用一個(gè)簡(jiǎn)簡(jiǎn)單單的網(wǎng)頁(yè)就打通了帳號(hào)、身份、支付、客服、售后等一系列操作,雖然簡(jiǎn)單,但是真的將移動(dòng)互聯(lián)網(wǎng)的Web生態(tài)囊括了更廣闊的內(nèi)容,也是移動(dòng)互聯(lián)網(wǎng)較PC互聯(lián)網(wǎng)更優(yōu)越、更猛烈的點(diǎn)之一。

以Android系統(tǒng)為例,Android手機(jī)上的App是使用Java語(yǔ)言編寫(xiě)的,而網(wǎng)頁(yè)中則運(yùn)行著一些Html、Javascript編寫(xiě)的代碼。Android的App是通過(guò)WebView(請(qǐng)親理解成一個(gè)組件,想象WebView就是一個(gè)沒(méi)有任何操作按鈕的瀏覽器,你輸入baidu.com他就打開(kāi)了百度的頁(yè)面)來(lái)展示一個(gè)網(wǎng)頁(yè)的,同時(shí)WebView為網(wǎng)頁(yè)和原生App建立一個(gè)橋梁,讓網(wǎng)頁(yè)和原生App能夠看到彼此暴露的一些方法,從而達(dá)到互相操作的目的。

當(dāng)然,這些操作是需要前端頁(yè)面和終端程序互相協(xié)商的。雖然很多App遵守了一些相同的原則,使網(wǎng)頁(yè)在不同的APP中都能具備相同的能力,但是如果你看到同一個(gè)網(wǎng)頁(yè)在一個(gè)App中能夠調(diào)用一些安卓系統(tǒng)的能力,而在另一個(gè)APP中卻沒(méi)有對(duì)應(yīng)的能力也不要覺(jué)得奇怪(找對(duì)應(yīng)App的開(kāi)發(fā)勾兌一下就好了)。

一個(gè)原生應(yīng)用為網(wǎng)頁(yè)開(kāi)放的能力越多,網(wǎng)頁(yè)對(duì)原生系統(tǒng)的操作能力就越強(qiáng),就越能做出逼近原生應(yīng)用的體驗(yàn)。但是,這卻是一把雙刃劍,因?yàn)樵鶤pp開(kāi)放的能力有可能會(huì)被惡意的頁(yè)面利用,對(duì)用戶(hù)造成傷害,如何控制能力的開(kāi)放,也是需要產(chǎn)品和開(kāi)發(fā)一起思考的問(wèn)題。

例如微信是一個(gè)終端能力的宿主,擁有支付,登錄,分享,獲取App信息等能力,并以Js接口的形式提供給前端頁(yè)面使用,前端開(kāi)發(fā)則需要在微信申請(qǐng)對(duì)應(yīng)的Js接口使用權(quán)限,才能夠在微信中正常使用對(duì)應(yīng)的能力。

最后總結(jié)一下,網(wǎng)頁(yè)塑造界面的優(yōu)勢(shì)在于靈活,隨時(shí)可以更新,而原生APP塑造的界面則能夠提供更流暢的用戶(hù)體驗(yàn),但是卻無(wú)法熱更新,只能依靠發(fā)布版本來(lái)提供新功能。通過(guò)上面說(shuō)的這種技術(shù),就可以利用各自的優(yōu)勢(shì),規(guī)避各自的劣勢(shì)來(lái)提供更好用戶(hù)體驗(yàn),例如在微信中購(gòu)物的展示是網(wǎng)頁(yè)形式的,方便運(yùn)營(yíng)快速更新,通過(guò)Js接口調(diào)用起原生的支付界面,給用戶(hù)更流暢的支付體驗(yàn),提高支付成功率。

2.應(yīng)用下載劫持

其實(shí)一次網(wǎng)絡(luò)下載的過(guò)程,就像一次“網(wǎng)購(gòu)”,當(dāng)我們點(diǎn)擊下載按鈕時(shí),就跟下載服務(wù)器下了一份“訂單”,“訂購(gòu)”了一個(gè)文件(當(dāng)然大部分是免費(fèi)的),服務(wù)器確認(rèn)“訂單”后,就會(huì)將文件在網(wǎng)絡(luò)中“快遞”(傳輸)到用戶(hù)的終端(手機(jī)、PC等)。下載劫持一般出現(xiàn)在“下訂單”的過(guò)程中。

舉個(gè)栗子,假設(shè)我們通過(guò)微信官網(wǎng)的鏈接下載微信安卓版本的客戶(hù)端。鏈接地址為:http://dldir1.qq.com/weixin/android/weixin637android660.apk,整個(gè)流程大概是這個(gè)樣子:

當(dāng)點(diǎn)擊了下載按鈕后,客戶(hù)端會(huì)通過(guò)url中的“域名”“dldir1.qq.com”來(lái)向DNS服務(wù)器獲取確認(rèn)“訂單(下載)服務(wù)器”的IP地址,IP地址在互聯(lián)網(wǎng)中相當(dāng)于日常生活中“電話(huà)號(hào)碼”,有了它,就可以連接到這臺(tái)“訂單(下載)服務(wù)器”,而DNS服務(wù)器就像一個(gè)存貯著大量“姓名”(域名)和“電話(huà)號(hào)碼”(IP地址)的黃頁(yè)。當(dāng)客戶(hù)端獲得了“訂單(下載)服務(wù)器”的“電話(huà)號(hào)碼”(ip地址)后,就會(huì)連接“訂單(下載)服務(wù)器”,并告知“訂單(下載)服務(wù)器”客戶(hù)端需要獲取服務(wù)器上的“微信安卓版”apk文件,一般情況下,服務(wù)器在這個(gè)階段確認(rèn)了“訂單”后,就會(huì)向客戶(hù)端“快遞”(傳輸)對(duì)應(yīng)的apk文件,當(dāng)客戶(hù)端將文件下載完畢后,這次“網(wǎng)購(gòu)”也就完成了。

下面,我們引入運(yùn)營(yíng)商(電信、聯(lián)通等)網(wǎng)關(guān)的概念。運(yùn)營(yíng)商網(wǎng)關(guān)可以類(lèi)比成日常生活中的“總機(jī)”,接入運(yùn)營(yíng)商的互聯(lián)網(wǎng)設(shè)備想要能夠“上網(wǎng)”,都需要經(jīng)過(guò)“總機(jī)”(運(yùn)營(yíng)商網(wǎng)關(guān))的轉(zhuǎn)接。也就是說(shuō),在上圖中的第二步,我們并不能直接通過(guò)“訂單(下載)服務(wù)器”的“電話(huà)號(hào)碼”(IP地址)聯(lián)系到“訂單(下載)服務(wù)器”,而是需要先連接到“總機(jī)”(網(wǎng)關(guān)),并且告訴它,我們要向某某某服務(wù)器下“訂單”,經(jīng)過(guò)“總機(jī)”的轉(zhuǎn)接,我們才能真正連接到“訂單(下載)服務(wù)器”。整個(gè)過(guò)程如下圖:

可以發(fā)現(xiàn),DNS服務(wù)器和網(wǎng)關(guān)的決策,確定了客戶(hù)端“訂單”(下載請(qǐng)求)的走向。而“下載劫持”也就發(fā)生在這兩個(gè)關(guān)鍵節(jié)點(diǎn)上。

假設(shè)客戶(hù)端獲取下載服務(wù)器“電話(huà)號(hào)碼”的DNS服務(wù)器被篡改,那么客戶(hù)端可能會(huì)通過(guò)“dldir1.qq.com”查詢(xún)到一個(gè)“騙子服務(wù)器”的“電話(huà)號(hào)碼”(IP地址),當(dāng)我們聯(lián)系到這個(gè)“騙子服務(wù)器”時(shí),我們的“訂單”(下載請(qǐng)求)可能會(huì)換來(lái)一些奇奇怪怪的“商品”。

當(dāng)我們遇到這種情況時(shí),可以手動(dòng)修改DNS服務(wù)器IP(具體方法請(qǐng)問(wèn)度娘)來(lái)解決。然而當(dāng)運(yùn)營(yíng)商的“總機(jī)”(網(wǎng)關(guān))“出了問(wèn)題”(這些“問(wèn)題”一般是運(yùn)營(yíng)商主動(dòng)造成的)時(shí),就沒(méi)那么容易解決了。假設(shè)當(dāng)客戶(hù)端拿著“訂單(下載)服務(wù)器”的電話(huà)號(hào)碼要求“總機(jī)”(網(wǎng)關(guān))轉(zhuǎn)接到我們指定的“訂單(下載)服務(wù)器”時(shí),“總機(jī)”(網(wǎng)關(guān))對(duì)客戶(hù)端說(shuō)“哎呀,不要去A家下載微信了,你去我給你介紹的B家下載“XX助手”吧,比微信好用”(這個(gè)過(guò)程在技術(shù)上是被一個(gè)叫做302跳轉(zhuǎn)的機(jī)制完成的,如果你不知道什么是302,出門(mén)左轉(zhuǎn),查詢(xún)我們星期一的文章)??蛻?hù)端是個(gè)實(shí)在人,就這樣被“引誘”到B家的服務(wù)器上下載了。

“總機(jī)”(網(wǎng)關(guān))和服務(wù)器B就這樣沆瀣一氣,來(lái)騙客戶(hù)端的下載量。

3.前端和后臺(tái)的數(shù)據(jù)交互與協(xié)議

目前,除了一些特別簡(jiǎn)單非聯(lián)網(wǎng)類(lèi)應(yīng)用(比如計(jì)算器、鬧鐘等),幾乎所有的應(yīng)用均是聯(lián)網(wǎng)應(yīng)用(比如新聞客戶(hù)端,微信等等),這些app客戶(hù)端基本都只是負(fù)責(zé)用戶(hù)的交互與數(shù)據(jù)收集與展示,真正的數(shù)據(jù)和服務(wù)均存儲(chǔ)在云端。

那移動(dòng)端究竟如何和后臺(tái)來(lái)交換數(shù)據(jù)并展示呢?我們打個(gè)比喻,其實(shí)整個(gè)過(guò)程跟去燒烤店兒擼串一樣一樣的。

拿任意一個(gè)新聞客戶(hù)端舉例,當(dāng)用戶(hù)刷新的那一刻(你萌生了吃燒烤的想法),客戶(hù)端開(kāi)始組織數(shù)據(jù)請(qǐng)求(你開(kāi)始穿衣洗臉打扮,并思考該去哪一家吃呢),當(dāng)用戶(hù)界面開(kāi)始展示 loading 的時(shí)候(這個(gè)時(shí)候你正走在 “馬大姐燒烤店” 的路上),經(jīng)過(guò)幾百毫秒的時(shí)間,這個(gè)時(shí)候請(qǐng)求數(shù)據(jù)已經(jīng)到了服務(wù)器(你已經(jīng)坐在了馬大姐燒烤店的桌子上),服務(wù)器開(kāi)始查看客戶(hù)端想要請(qǐng)求哪方面的數(shù)據(jù),是請(qǐng)求財(cái)經(jīng)頻道的,還是請(qǐng)求汽車(chē)頻道的數(shù)據(jù)(服務(wù)員遞來(lái)了菜單,問(wèn)你想吃啥),服務(wù)器看懂了客戶(hù)端的想法開(kāi)始準(zhǔn)備數(shù)據(jù)(你點(diǎn)了 20 個(gè)肉串,10 個(gè)大腰子),服務(wù)器看到你請(qǐng)求的是汽車(chē)頻道和財(cái)經(jīng)頻道的數(shù)據(jù)(光著膀子的烤串師傅開(kāi)始烤這 20 個(gè)串和 10 個(gè)大腰子),并給回到服務(wù)員,服務(wù)員一路小跑,將你要的串和腰子遞到你的面前,這個(gè)時(shí)候相當(dāng)于數(shù)據(jù)已經(jīng)傳回到了客戶(hù)端,客戶(hù)端 loading 消失,你看到了最新的兩個(gè)頻道的數(shù)據(jù)。

那客戶(hù)端和服務(wù)器之間傳輸數(shù)據(jù)的格式是怎么樣的呢?

現(xiàn)在流行的做法通常有兩種,一種是類(lèi)似于PB(Protocol?Buffer,Google定義的一個(gè)數(shù)據(jù)傳輸協(xié)議,以簡(jiǎn)潔,省流,易用出名)的二進(jìn)制數(shù)據(jù)(二進(jìn)制數(shù)據(jù)的意思就是你打開(kāi)這個(gè)文件你只能看到0和1組成的數(shù)字串,是沒(méi)辦法和你生活中任何認(rèn)識(shí)的字母聯(lián)系在一起的)傳輸,這種格式的好處是包小,重復(fù)的字段會(huì)被節(jié)省。

另一種是JSON(JavaScriptObject?Notation),這也是一種輕量級(jí)的數(shù)據(jù)傳輸格式,就是用一堆中括號(hào)把數(shù)據(jù)組織起來(lái),不像二進(jìn)制,這種格式是人可讀的,并且比較輕巧,所以也有大量的應(yīng)用場(chǎng)景。下面這段數(shù)據(jù)就是JSON格式,簡(jiǎn)單解讀一下,就是people對(duì)應(yīng)了三個(gè)人,三個(gè)人分別是中括號(hào)間的三個(gè)花括號(hào)中的人。

聊聊前端和后臺(tái)的數(shù)據(jù)交互與協(xié)議

總結(jié)起來(lái),十分簡(jiǎn)單,移動(dòng)端提出需求,服務(wù)器按要求組織好數(shù)據(jù)發(fā)給你,針對(duì)不同的格式,移動(dòng)端自己解析,展示,完活兒。其實(shí),不止移動(dòng)端,前端網(wǎng)頁(yè)和后臺(tái),后臺(tái)和后臺(tái)之間也是這個(gè)道理。

#專(zhuān)欄作家#

給產(chǎn)品經(jīng)理講技術(shù),微信公眾號(hào)(pm_teacher),人人都是產(chǎn)品經(jīng)理專(zhuān)欄作家。資深程序猿,專(zhuān)注客戶(hù)端開(kāi)發(fā)若干年,對(duì)前端、后臺(tái)技術(shù)略懂,熱衷于對(duì)新的科技領(lǐng)域的探索。

本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,不得轉(zhuǎn)載。

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 安卓和IOS的區(qū)別得辯證看吧,現(xiàn)在iOS哪里還算高富帥啊

    來(lái)自河南 回復(fù)
  2. 必須手動(dòng)點(diǎn)贊!

    來(lái)自上海 回復(fù)
  3. 除了了解基礎(chǔ)技術(shù)知識(shí),還讓我認(rèn)識(shí)到了語(yǔ)言風(fēng)格的重要性,感謝!

    來(lái)自北京 回復(fù)
  4. 寫(xiě)的真好,有質(zhì)有量

    來(lái)自陜西 回復(fù)
  5. 分兩天讀完,有質(zhì)有量

    來(lái)自貴州 回復(fù)
  6. 非常感謝

    來(lái)自江蘇 回復(fù)
  7. 寫(xiě)得太好了,我盡一口氣看了兩遍

    來(lái)自廣東 回復(fù)
  8. 太感謝了 解釋的通俗易懂 謝謝

    來(lái)自北京 回復(fù)
  9. 給力給力

    來(lái)自上海 回復(fù)
  10. 如果產(chǎn)品經(jīng)理不懂這些會(huì)有什么問(wèn)題?

    來(lái)自廣東 回復(fù)
    1. 比如有些需求能不能實(shí)現(xiàn),你應(yīng)該能自己先過(guò)濾一遍,然后再到開(kāi)發(fā)手里,另外產(chǎn)品經(jīng)理也要關(guān)注數(shù)據(jù)的傳輸、存儲(chǔ)、結(jié)構(gòu)、分析等等

      來(lái)自廣東 回復(fù)
  11. 很有意思,感謝 ?

    來(lái)自廣東 回復(fù)
  12. 可以說(shuō)是非常全面了

    來(lái)自廣東 回復(fù)