整合營銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費咨詢熱線：
輯導(dǎo)語：User Agent，簡稱UA，中文名為用戶代理，是一種向訪問網(wǎng)站提供你所使用的瀏覽器類型及版本、操作系統(tǒng)及版本、瀏覽器內(nèi)核、等信息的標(biāo)識。通過這個標(biāo)識，用戶所訪問的網(wǎng)站可以顯示不同的排版從而為用戶提供更好的體驗或者進(jìn)行信息統(tǒng)計。接下來，本文作者為我們總結(jié)了其發(fā)展的趣味史。
最近在看《給產(chǎn)品經(jīng)理講技術(shù)》，其中有一段簡要的提到了瀏覽器UserAgent的含義和作用。在最后作者暗示UserAgent的變遷是一段充滿趣味性的歷史，為了滿足我的好（吃）奇（瓜）心理，我去深扒了一下。
結(jié)果不扒不知道，一扒嚇一跳。今天就給大家分享一下這個陳年老瓜。
首先，我們先簡要了解一下各大瀏覽器的出生日期：
大家先對這些瀏覽器的出生時間有一個概念，然后大家把板凳和西瓜拿好，讓我們開始吧~
1989年，超級大神伯納斯·李教授發(fā)明了萬維網(wǎng)（World Wide Web，簡稱3W），然而大神并不滿足于此，為了大家能更方便地訪問萬維網(wǎng)，大神大手一揮，推出了世界上第一款瀏覽器。
李大神尋思給它起個什么名字呢？
此時，李大神可能是懶蟲上身，想也不想，要不就叫World Wide Web，跟大兒子（萬維網(wǎng)）一個名字吧！
后來大神感覺交流起來不是很方便，經(jīng)常不知道World Wide Web指的是誰，而且這么偷懶的行為有點對不起小兒子，于是把小兒子的名字改成了Nexus。
由于是瀏覽器的祖師爺，沒有競爭對手，Nexus馬上就流行了起來。
由于是最早的瀏覽器，Nexus只支持文字展示，還不支持圖片展示，而這恰好給了競爭對手可乘之機(jī)，同時也是UserAgent的由來。
1993年，伊利諾伊的NCSA組織認(rèn)為沒有圖片的網(wǎng)頁就像失去顏色的世界！作為一群完美主義者，這完全不能忍！
因此他們發(fā)明了第一個可以顯示圖片的瀏覽器：Mosaic（馬賽克），能顯示圖片，但大神們偏偏任性取名叫馬賽克！眾多吃瓜群眾不禁直呼內(nèi)行！
由于能顯示圖片的特性，Mosaic迅速流行了起來。但是到這里，大家可能會發(fā)現(xiàn)，此時的霸主是Nexus，它是不能顯示圖片的，而Mosaic能顯示，這就叫html的開發(fā)陷入了兩難的境地。
正當(dāng)html開發(fā)者抓耳撓腮的時候，體貼的Mosaic想到了一個辦法：這本質(zhì)上就是一個身份的問題嘛，那我就在給你發(fā)請求的時候告訴你們我的身份，和Nexus區(qū)分開來不就行了？
這就是UserAgent的由來，它最初的作用只是向服務(wù)器表明自己的身份——Mosaic的UserAgent為：NCSA_Mosaic/2.0 (Windows 3.1)
NCSA_Mosaic代表自己是什么瀏覽器，2.0代表版本號，Windows 3.1表示自己可以在什么系統(tǒng)下運行。
這樣一來，html開發(fā)者該怎么開發(fā)還是怎么開發(fā)，只是如果UserAgent表明是Mosaic就發(fā)送帶圖片的網(wǎng)頁，如果不是，就發(fā)送不帶圖片的網(wǎng)頁。
但是，伊利諾伊的大神們到死也不會想到，就這么簡單的一個UserAgent，竟然被后輩們玩出了花。
看到Mozilla，大家是不是很眼熟？隨便打開一個瀏覽器，查看它的UserAgent，都會發(fā)現(xiàn)帶有Mozilla標(biāo)記。是不是很奇怪，為什么不同公司的瀏覽器，不管是IE、谷歌、Safari等，都帶有Mozilla呢？聽我慢慢道來。
在Mosaic如日中天的時候，一頭初生怪獸偏偏不服，它為自己設(shè)立了一個偉大的目標(biāo)：推翻Mosaic的霸主地位！
這頭初生怪獸就是后來大名鼎鼎的網(wǎng)景公司，他們發(fā)明了一款瀏覽器，希望能夠取代Mosaic！而不愧是初生怪獸，沒別的，就是頭鐵，大神們給他們的瀏覽器取名為：Mozilla。
什么意思呢？ Mozilla由“Mosaic Killa”（Killa是俚語中Killer的拼法）變化而來，并且是怪獸Godzilla（哥斯拉）的諧音，即“Godzilla eat the Mosaic！”
這就是赤果果的挑釁啊！你看，互聯(lián)網(wǎng)的源頭就充斥著血腥！
Mozilla大聲喝問道：Mosaic你這老頭子怕不怕！Mosaic瑟瑟發(fā)抖（不知道是氣的，還是怕的）地看著這頭狂妄的小怪獸，勃然大怒（惱羞成怒）到：“給老子滾粗！”
于是網(wǎng)景礙于當(dāng)時Mosaic的江湖地位，不得已“從心”的把名字改成了Netscape Navigator(網(wǎng)景航海家)。
但是“小怪獸”口服心不服，仍然偷偷地在自己的UserAgent后面寫上了Mozilla/1.0 (Win3.1)。
小怪獸還是有點本事的，NetScape最先支持html框架顯示，就是簡單的table布局，內(nèi)外邊距之類，僅僅這點在體驗上就遠(yuǎn)超Mosaic。
所以，最后Mozilla如愿”吃掉了”Mosaic，成為了霸主。
開發(fā)者為了區(qū)別這兩個瀏覽器，還是用的UserAgent。約定如果是UserAgent里含有“Mozilla”字樣，就發(fā)送支持框架的頁面，否則就發(fā)送不含框架的頁面。
瀏覽器作為萬維網(wǎng)的入口，從來都是戰(zhàn)略必爭之地，競爭自然無法避免。微軟率先使出了”不要臉“戰(zhàn)術(shù)”，仗著自己的操作系統(tǒng)地位，開發(fā)了一款強(qiáng)行和系統(tǒng)綁定的瀏覽器。
古語云：流氓不可怕，就怕流氓有文化！古人誠不欺我！
那么這個瀏覽器叫什么好呢？
吃瓜群眾：Mozilla killer？
微軟大神：滾蛋，能不能像我們一樣成熟一點？！
務(wù)實的微軟大神們?nèi)∶刹桓氵@些花里胡哨的，直接取名叫IE，即Internet Explore，雖然沒有Mozilla這么霸氣，但是簡單易懂且易記啊。
要想和Mozilla競爭，IE肯定也是支持html框架的，但是開發(fā)者們才不管，開發(fā)者們只會給UserAgent帶有Mozilla的瀏覽器發(fā)送帶框架的頁面。
但是你以為這點小事就能難倒我大微軟，天真！
微軟眼咕嚕一轉(zhuǎn)，呵呵一笑：切，既然如此，那我易容成Mozilla不就行了？
于是，微軟給IE披上了一層怪獸皮，把自己的UserAgent改成了：Mozilla/1.22 (compatible; MSIE 2.0; Windows 95)。
你看，我也是Mozilla，這樣你就可以把帶框架的頁面發(fā)給我了~
嘗到耍流氓甜頭的微軟一發(fā)不可收拾，利用自己操作系統(tǒng)的優(yōu)勢，將易容后的IE強(qiáng)制和操作系統(tǒng)綁定：你就用我的系統(tǒng)免費贈送的IE瀏覽器，還要啥自行車？！
憑借不輸Mozilla的性能和流氓的手段，IE最終戰(zhàn)勝了Mozilla，但是從此IE也永久帶上了Mozilla的標(biāo)記。
但是，怪獸不愧是怪獸，強(qiáng)大的怪獸怎么能被流氓輕易擊敗呢？！
曾經(jīng)Mozilla的大神們卷土重來，他們使用瀏覽器排版引擎Gecko(壁虎)發(fā)明了另一款優(yōu)秀的瀏覽器，它在插件拓展和開發(fā)調(diào)試領(lǐng)域做出的貢獻(xiàn)，絕對可以載入互聯(lián)網(wǎng)歷史。
這么跨時代的創(chuàng)造，叫什么好呢？眾所周知，Mozilla的大神們總是對怪獸情有獨鐘，既然我們從失敗中浴火重生，那么其名曰：Phoenix(鳳凰)！！
但是Phoenix(鳳凰)還沒起飛就遭遇了折翼，旁邊一家叫鳳凰科技的公司強(qiáng)烈抗議：魂淡，是我先叫Phoenix(鳳凰)的，你們侵權(quán)了！
大神們很無奈，沒辦法，那我們叫Firebird(火鳥)，總行了吧？！雖然聽起來挺中二的，但是也不行。因為有一款數(shù)據(jù)庫也叫這個名字。
大神們抓狂，起個名字怎么這么難？！淚流滿面的大神們最終給這款劃時代的瀏覽器起名叫FireFox（火狐）。
FireFox（火狐）至今還是最常用的瀏覽器之一，可見其優(yōu)秀程度竟恐怖如斯！
大神們?yōu)榱烁嬖V開發(fā)者們，我是如此的優(yōu)秀，你們可以給我更好更炫酷的頁面了！
于是，F(xiàn)ireFox（火狐）標(biāo)志自己的UserAgent為：Mozilla/5.0 (Windows; U; Windows NT 5.1; sv-SE; rv:1.7.5) Gecko/20041108 Firefox/1.0。
雖然這個UserAgent看起來很長，但是信息還是比較清晰，表明了自己的身份是Moziila5.0和Firefox/1.0，支持的系統(tǒng)和使用的Gecko的引擎。
和之前一樣，開發(fā)者們只會給作為開創(chuàng)者的FireFox（火狐）發(fā)送更優(yōu)質(zhì)的html頁面。FireFox（火狐）憑借優(yōu)秀的性能，發(fā)展非常迅速，雖然沒有打敗IE，但是也能和IE分庭抗禮。
而在IE和FireFox（火狐）互掐的時候，其實市場上還存在另外一個著名的操作系統(tǒng)Linux。Linux看著Window的IE瀏覽器非常眼紅，于是尋思著也開發(fā)一款基于Linux的瀏覽器。
大神就是大神，開發(fā)瀏覽器就是小菜一碟！成功以后，Linux大神們一樣不能免俗，要為自己的孩子起一個響亮且霸氣的名字。
前有Moziila（哥斯拉），后有IE（探索者），那我們…..嗯，就叫：Konqueror(Conqueror的變體，低調(diào)低調(diào))征服者吧！（666666）。
但是，Konqueror使用的是KHTML排版引擎，失去了先發(fā)優(yōu)勢。所以，Konqueror也遇到了和IE類似的問題：開發(fā)者們只認(rèn)UserAgent里面帶有Gecko的瀏覽器，不帶就休想獲得帶有良好排版的頁面！
小Konqueror非常無奈，萬分糾結(jié)之下，做出了一個又騷又賤但是又特別萌的操作，把自己的UserAgent寫成：Mozilla/5.0 (compatible; Konqueror/3.2; FreeBSD) (KHTML, like Gecko)。
就這樣，偉大的Konqueror為了獲取更優(yōu)質(zhì)的頁面，也不得不耍了點小心機(jī)。從此，（KHTML，like Gecko） 與IE的Mozilla一樣成了一道抹不去的印記。
發(fā)展到這，你以為就結(jié)束了嗎？天真！在互聯(lián)網(wǎng)這個狂熱的世界，只有你想不到，沒有你做不到！
腦洞大開的Opera覺得IE和Konqueror的做法真的太棒了，甚得吾心！那咱也不能示弱啊：既然有這么多可以選擇的UserAgent（馬甲），那我們是不是可以想變成誰就變成誰？！（Opera的大神們可能是百變小櫻的忠實粉絲）。
Opera直接在菜單提供了三個選擇項：
第一個是IE，第二個是火狐，第三個才是自己，芭芭拉小魔仙，你想變誰就變誰！
與此同時，在科技的貴圈里，怎么能少得了我大Apple？！蘋果公司依靠“自己的”WebKit，開發(fā)出Safari，并將UserAgent命名為：Mozilla/5.0 (Macintosh; U; PPC Mac OS X; de-de) AppleWebKit/85.7 (KHTML, like Gecko) Safari/85.5。
誒？！仔細(xì)一看，這不對啊，AppleWebKit不是蘋果公司自己的嗎，為啥還會帶有(KHTML, like Gecko)？！
蘋果邪魅一笑：呵呵，大驚小怪，因為我們的內(nèi)核Webkit排版引擎的核心叫WebCore，而WebCore是KHTML衍生而來的。也就是說，WebCore是KHTML的兒子，子承父業(yè)，蘋果公司只能在UserAgent加上 (KHTML, like Gecko) 。
在越發(fā)混亂的瀏覽器貴圈里，谷歌也不甘寂寞，跳出來大聲宣布：我大谷歌也開發(fā)了一款瀏覽器，它叫Chrome！
而Chrome設(shè)定的UserAgent為：Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/525.13 (KHTML, like Gecko) Chrome/0.2.149.27 Safari/525.13。
Safari一看：臥槽，從未見過如此厚顏無恥之徒！你怎么也在后面寫有Safari？
Chrome呵呵一笑，你懂的——原來Chrome瀏覽器的內(nèi)核也是Webkit。
所以，最后讓我們來順一下：
至此，現(xiàn)在的瀏覽器，你隨便打開一個，查看他們的UserAgent，都會發(fā)現(xiàn)或多或少帶有這些印記。
大家現(xiàn)在應(yīng)該明白瀏覽器中那長長的UserAgent是怎么來的了吧。
作者：Jarvan；公眾號：產(chǎn)品叨比叨
本文由 @Jarvan 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載
題圖來自Unsplash，基于CC0協(xié)議
文筆者將與大家分享HTML/CSS/JavaScript這三種網(wǎng)頁技術(shù)，以及HTML5、H5等的相關(guān)知識。
網(wǎng)頁存儲在某臺計算機(jī)（即服務(wù)器）上，并通過網(wǎng)絡(luò)與其他計算機(jī)相連。網(wǎng)頁通過網(wǎng)址（URL）來識別與訪問，當(dāng)我們在瀏覽器輸入網(wǎng)址后，經(jīng)過一段復(fù)雜而又快速的程序，網(wǎng)頁會被下載到用戶的計算機(jī)上，用戶的瀏覽器會解析網(wǎng)頁內(nèi)容，最終展示給用戶。
網(wǎng)頁展示的信息可以包括：圖片、文字、音頻、視頻等內(nèi)容，網(wǎng)頁上面還有鏈接指向更多的網(wǎng)頁，最終形成一個巨大的互聯(lián)網(wǎng)。
比如：百度的網(wǎng)頁就存儲在百度的服務(wù)器中，當(dāng)我們在瀏覽器中輸入網(wǎng)址www.baidu.com（即URL地址），百度的網(wǎng)頁會從服務(wù)器下載到本地計算機(jī)上，瀏覽器接收這些數(shù)據(jù)并解析，百度的首頁就顯示出來了。
在電腦端，我們使用瀏覽器瀏覽網(wǎng)頁，比如：使用Internet Explorer、Edge、Chrome、Safari、360安全瀏覽器、搜狗瀏覽器、QQ瀏覽器等瀏覽器，訪問的網(wǎng)頁可以是搜索引擎https://www.baidu.com，可以是電商平臺https://www.taobao.com，甚至是社交平臺https://wx.qq.com。
由于移動互聯(lián)網(wǎng)的大發(fā)展，很多人可能沒有意識到，網(wǎng)頁其實可以實現(xiàn)大部分常用的功能。
手機(jī)、iPad上也有各種瀏覽器，我們可以輸入網(wǎng)址并直接訪問，各大手機(jī)廠商在手機(jī)中預(yù)先安裝了自己的瀏覽器，阿里巴巴、百度、騰訊、搜狗等互聯(lián)網(wǎng)公司也推出了自家的瀏覽器APP。為了獲得競爭優(yōu)勢，互聯(lián)網(wǎng)公司還在瀏覽器上開發(fā)了各種功能，比如：智能搜索、去廣告插件等。
除了瀏覽器，不少APP也嵌入了瀏覽器功能。
比如：微信的公眾號，我們打開一篇微信公眾號文章，就是打開一個網(wǎng)頁；等新聞客戶端也是個巨大的瀏覽器，我們打開一條新聞，就是進(jìn)入相應(yīng)的網(wǎng)頁；淘寶里面的商品簡介，也是個網(wǎng)頁。這些網(wǎng)頁“偽裝”得太像APP頁面了，以至于我們沒有意識到。
文字、圖片、表格、音頻、視頻是網(wǎng)頁最常見的元素。
在網(wǎng)頁上點擊鼠標(biāo)右鍵，選擇菜單中的 “查看源文件” ，就可以看到網(wǎng)頁的實際內(nèi)容：網(wǎng)頁實際上只是一個純文本文件！它通過各式各樣的標(biāo)記對頁面上的文字、圖片、表格、聲音等元素進(jìn)行描述，而瀏覽器則對這些標(biāo)記進(jìn)行解釋并生成頁面，于是就得到我們看到的豐富的頁面。
比如：在微信公眾平臺官網(wǎng)（>https://mp.weixin.qq.com）點擊右鍵，查看源文件，可以發(fā)現(xiàn)這個網(wǎng)頁的源文件全都都是文字。
你可能會奇怪，為什么在源文件看不到任何圖片，而在瀏覽器顯示的時候可以看到呢？
這些文件中存放的只是圖片的鏈接位置，圖片與網(wǎng)頁文件是各自獨立存放的，甚至可以不在同一臺計算機(jī)上，瀏覽器可以自動訪問這些鏈接并顯示出來。音頻、視頻等非文字內(nèi)容也是類似的。
絕大多數(shù)網(wǎng)頁是由HTML、CSS和JavaScript三種技術(shù)開發(fā)的，HTML/CSS/JavaScript也被稱為網(wǎng)頁三劍客。
HTML提供網(wǎng)頁內(nèi)容和結(jié)構(gòu)，CSS控制網(wǎng)頁的外觀，JavaScript提供用戶交互，一個很經(jīng)典的例子是說HTML就像一個人的骨骼、器官，而CSS就是人的皮膚，有了這兩樣也就構(gòu)成了一個植物人了，加上javascript這個植物人就可以對外界刺激做出反應(yīng)，可以思考、運動、可以給自己整容化妝等等，成為一個活生生的人。
HTML（Hypertext Markup Language，超文本標(biāo)記語言）是一門標(biāo)記語言，用于創(chuàng)建網(wǎng)頁和 Web 應(yīng)用程序，HTML的基本元素是<p><img><table>等元素，分別表示文本、圖像、表格等。瀏覽器發(fā)出 URL 請求時，首先需要返回 HTML 文檔，之后瀏覽器對該文件進(jìn)行解析。
比如：下面是一個基本的網(wǎng)頁，左邊是網(wǎng)頁源代碼，右邊是展示效果。<html></html>之間是網(wǎng)頁的全部內(nèi)容，<head></head>之間是標(biāo)題相關(guān)的內(nèi)容，這里為空，<body></body>之間是網(wǎng)頁的主體內(nèi)容，<h1></h1>之間是標(biāo)題，<p></p>之間的內(nèi)容是正文。
CSS（Cascading Stylesheet，級聯(lián)樣式表）用于控制 HTML 元素的外觀和布局，對文檔進(jìn)行修飾，使文檔更加美觀，用戶看起來更舒服。 CSS 樣式可直接應(yīng)用于 HTML 元素，單獨對單個界面裝飾，也可以對多個界面裝飾。
比如，下面是一個添加CSS樣式的網(wǎng)頁，左邊是網(wǎng)頁源代碼，右邊是展示效果。body{background-color:#d0e4fe}，設(shè)置了<body></body>之間的內(nèi)容的背景顏色是#d0e4fe，h1{color:orange;text-align:center;}設(shè)置了<h1></h1>之間的文字顏色為橙色（orange），文字的位置是居中（center）。
為了提高編程效率，通常將CSS單獨寫在一個文件中，而是不是將CSS與HTML混合編程。
JavaScript 是動態(tài)的解釋性編程語言，可以實現(xiàn)用戶的交互和數(shù)據(jù)傳輸。
比如：我們常見的賬號、密碼驗證，就是通過JavaScript傳遞到服務(wù)器并返回服務(wù)器處理結(jié)果的。
比如：下面是一個添加JavaScript的網(wǎng)頁，左邊是網(wǎng)頁源代碼，右邊是展示效果。<script>function displayDate{document.getElementById(“demo”).innerHTML=Date;}</script> 是JavaScript代碼，點擊按鈕，id=demo的內(nèi)容變成時間。
與CSS類似，通常將 JavaScript 組織到單獨的文件中，而不是與HTML混合編程。為了提高JavaScript開發(fā)速度，也有一些開源庫可以使用，常見的是jQuery 、Vue.js， 極大地簡化了 JavaScript 編程。
為了提高網(wǎng)站的設(shè)計、編程速度，也有很多開源的庫可以使用，最常用的Bootstrap庫。Bootstrap庫來自 Twitter，是目前最受歡迎的前端框架，Bootstrap 是基于 HTML、CSS、JavaScript的，它簡潔靈活，使得 Web 開發(fā)更加快捷。
2014年10月，萬維網(wǎng)聯(lián)盟宣布，經(jīng)過接近8年的艱苦努力，HTML5標(biāo)準(zhǔn)規(guī)范終于制定完成。
從技術(shù)上看，HTML5本身是HTML，HTML是超文本標(biāo)記語言，“5” 代表HTML第五次重大修改，可以理解為迭代之后的第五個版本，包含了很多功能特性。
HTML5的設(shè)計目的是：在移動設(shè)備上支持多媒體。
為了實現(xiàn)這種目的，HTML5引入了新的特性，比如用于繪畫的 canvas 元素，可以使用HTML5繪制簡單的圖像；用于視頻和音頻的的 video 和 audio 元素，可以使用HTML5播放視頻和音頻； HTML5可以調(diào)用數(shù)據(jù)庫；新的控件，比如 calendar、date、time、email、url、search，可以使用HTML5實現(xiàn)更好的用戶交互。
“刷爆朋友圈的H5”，“0基礎(chǔ)學(xué)習(xí)H5…”，“H5速成班”，H5這個詞經(jīng)常出現(xiàn)在媒體中，甚至還出現(xiàn)了在線H5制作平臺，我們可以通過點擊、拖動實現(xiàn)美觀的網(wǎng)頁。
比如：我們可以使用百度的H5在線制作平臺，免費制作H5網(wǎng)頁。
顯然，這里所說的H5不是HTML5編程規(guī)范，更像是一種利用HTML5技術(shù)，制作包含文字、圖片、音頻等內(nèi)容的炫酷網(wǎng)頁，以此實現(xiàn)“病毒式營銷”。
因此，H5并非技術(shù)概念，與其說是H5，不如說是“移動營銷頁面”，是營銷領(lǐng)域“濫用”技術(shù)名詞的產(chǎn)物。
因此，出現(xiàn)《H5+移動營銷設(shè)計指南》這類的書籍就不奇怪了。根據(jù)這本書的介紹，H5的原型要具備視覺、動效、節(jié)奏、音效、交互、可實施性等因素，H5頁面不太適合深度的閱讀，大部分使用場景是在地鐵上、電梯里、等上菜的時間等等。
2018年，宣稱擁有自主可控和安全瀏覽器內(nèi)核技術(shù)的瀏覽器廠商“紅芯”高調(diào)宣布融資2.5億元C輪系列融資，其中不乏晨興資本、達(dá)晨創(chuàng)投、IDG資本等知名風(fēng)險投資機(jī)構(gòu)參與。
隨后，網(wǎng)友發(fā)現(xiàn)：紅芯瀏覽器的文件結(jié)構(gòu)與谷歌瀏覽器文件結(jié)構(gòu)基本一模一樣，甚至連“屬性”里的Chrome都沒有改掉，安裝文件里竟然還有Chrome的LOGO。
瀏覽器內(nèi)核是瀏覽器的核心，紅芯瀏覽器并沒有自己開發(fā)瀏覽器內(nèi)核，而是使用Chrome內(nèi)核，這意味著“紅芯”并不是自主可控的瀏覽器，而是在Chrome內(nèi)核的基礎(chǔ)上，換了個“皮”，做出了一個瀏覽器。
不少手機(jī)游戲廠商也在玩兒類似的游戲，將國外的游戲換個背景，再把英文翻譯成中文，就直接在國內(nèi)上線。
網(wǎng)頁是由HTML、CSS、JavaScript等語言開發(fā)的，瀏覽器獲得HTML網(wǎng)頁之后，需要根據(jù)CSS、JS重新組織網(wǎng)頁并顯示在屏幕上。
比如：我們訪問微信公眾平臺的首頁https://mp.weixin.qq.com，瀏覽器獲得的是一堆文字，瀏覽器需要將這些文字變成我們看到的界面。
實現(xiàn)這些工作的就是瀏覽器內(nèi)核。瀏覽器內(nèi)核又可以分成兩部分：渲染引擎(Rendering Engine)和 JS （JavaScript）引擎。
渲染引擎負(fù)責(zé)取得網(wǎng)頁的內(nèi)容（HTML、XML、圖像等等）、整理信息（例如加入 CSS 等），計算網(wǎng)頁的顯示方式，然后會輸出至顯示屏。瀏覽器內(nèi)核對網(wǎng)頁的語法解釋會有所不同，所以渲染的效果也不相同。
JS 引擎則是解析 Javascript 語言，執(zhí)行 javascript 語言來實現(xiàn)網(wǎng)頁的動態(tài)效果和用戶交互。
瀏覽器的種類有很多，但瀏覽器內(nèi)核就那么幾個。常見的是微軟 IE 瀏覽器內(nèi)核 Trident、谷歌 Chrome 瀏覽器內(nèi)核 Blink、蘋果 Safari 內(nèi)核 Webkit 和火狐瀏覽器內(nèi)核 Gecko。
國內(nèi)的瀏覽器，比如：360瀏覽器、QQ瀏覽器、搜狗瀏覽器、2345瀏覽器等，實際上使用的還是這幾種開源的瀏覽器內(nèi)核，并在內(nèi)核的技術(shù)上，做了一些界面和效果。
比如：一些瀏覽器打出雙引擎的旗號，所謂雙引擎就是使用了IE和Chrome兩個引擎，因為國內(nèi)的很多網(wǎng)站還只能使用IE訪問，最典型的就是很多銀行的網(wǎng)站，這時候如果使用兩個引擎可以給用戶無縫切換，帶來良好的體驗。
正如發(fā)動機(jī)是汽車的核心一樣，瀏覽器內(nèi)核是瀏覽器的核心，那我們?yōu)槭裁床蛔约洪_發(fā)一個國產(chǎn)瀏覽器內(nèi)核呢？
主要原因是兩個：
本文由@linghu 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，禁止轉(zhuǎn)載
題圖來自Unsplash, 基于CC0協(xié)議
TTP是什么?
當(dāng)我們想瀏覽一個網(wǎng)站的時候，只要在瀏覽器的地址欄里輸入網(wǎng)站的地址就可以了，例如www.microsoft.com,但是在瀏覽器的地址欄里面出現(xiàn)的卻是：http://www.microsoft.com ,你知道為什么會多出一個“http”嗎？
一、HTTP協(xié)議是什么
我們在瀏覽器的地址欄里輸入的網(wǎng)站地址叫做URL (Uniform Resource Locator，統(tǒng)一資源定位符)。就像每家每戶都有一個門牌地址一樣，每個網(wǎng)頁也都有一個Internet地址。當(dāng)你在瀏覽器的地址框中輸入一個URL或是單擊一個超級鏈接時，URL就確定了要瀏覽的地址。瀏覽器通過超文本傳輸協(xié)議(HTTP)，將Web服務(wù)器上站點的網(wǎng)頁代碼提取出來，并翻譯成漂亮的網(wǎng)頁。因此，在我們認(rèn)識HTTP之前，有必要先弄清楚URL的組成,例如：http://www.microsoft.com/china/index.htm。它的含義如下：
1. http://：代表超文本傳輸協(xié)議，通知microsoft.com服務(wù)器顯示W(wǎng)eb頁，通常不用輸入；
2. www：代表一個Web（萬維網(wǎng)）服務(wù)器；
3. Microsoft.com/：這是裝有網(wǎng)頁的服務(wù)器的域名，或站點服務(wù)器的名稱；
4. China/：為該服務(wù)器上的子目錄，就好像我們的文件夾；
5. Index.htm：index.htm是文件夾中的一個HTML文件（網(wǎng)頁）。
我們知道，Internet的基本協(xié)議是TCP/IP協(xié)議，然而在TCP/IP模型最上層的是應(yīng)用層（Application layer），它包含所有高層的協(xié)議。高層協(xié)議有：文件傳輸協(xié)議FTP、電子郵件傳輸協(xié)議SMTP、域名系統(tǒng)服務(wù)DNS、網(wǎng)絡(luò)新聞傳輸協(xié)議NNTP和HTTP協(xié)議等。
HTTP協(xié)議（Hypertext Transfer Protocol，超文本傳輸協(xié)議）是用于從WWW服務(wù)器傳輸超文本到本地瀏覽器的傳送協(xié)議。它可以使瀏覽器更加高效，使網(wǎng)絡(luò)傳輸減少。它不僅保證計算機(jī)正確快速地傳輸超文本文檔，還確定傳輸文檔中的哪一部分，以及哪部分內(nèi)容首先顯示(如文本先于圖形)等。這就是你為什么在瀏覽器中看到的網(wǎng)頁地址都是以http://開頭的原因。
自WWW誕生以來，一個多姿多彩的資訊和虛擬的世界便出現(xiàn)在我們眼前，可是我們怎么能夠更加容易地找到我們需要的資訊呢？當(dāng)決定使用超文本作為WWW文檔的標(biāo)準(zhǔn)格式后，于是在1990年，科學(xué)家們立即制定了能夠快速查找這些超文本文檔的協(xié)議，即HTTP協(xié)議。經(jīng)過幾年的使用與發(fā)展，得到不斷的完善和擴(kuò)展，目前在WWW中使用的是HTTP/1.0的第六版。二、HTTP是怎樣工作的
既然我們明白了URL的構(gòu)成，那么HTTP是怎么工作呢？我們接下來就要討論這個問題。
由于HTTP協(xié)議是基于請求/響應(yīng)范式的（相當(dāng)于客戶機(jī)/服務(wù)器）。一個客戶機(jī)與服務(wù)器建立連接后，發(fā)送一個請求給服務(wù)器，請求方式的格式為：統(tǒng)一資源標(biāo)識符（URL）、協(xié)議版本號，后邊是MIME信息包括請求修飾符、客戶機(jī)信息和可能的內(nèi)容。服務(wù)器接到請求后，給予相應(yīng)的響應(yīng)信息，其格式為一個狀態(tài)行，包括信息的協(xié)議版本號、一個成功或錯誤的代碼，后邊是MIME信息包括服務(wù)器信息、實體信息和可能的內(nèi)容。
許多HTTP通訊是由一個用戶代理初始化的并且包括一個申請在源服務(wù)器上資源的請求。最簡單的情況可能是在用戶代理和服務(wù)器之間通過一個單獨的連接來完成。在Internet上，HTTP通訊通常發(fā)生在TCP/IP連接之上。缺省端口是TCP 80，但其它的端口也是可用的。但這并不預(yù)示著HTTP協(xié)議在Internet或其它網(wǎng)絡(luò)的其它協(xié)議之上才能完成。HTTP只預(yù)示著一個可靠的傳輸。
這個過程就好像我們打電話訂貨一樣，我們可以打電話給商家，告訴他我們需要什么規(guī)格的商品，然后商家再告訴我們什么商品有貨，什么商品缺貨。這些，我們是通過電話線用電話聯(lián)系（HTTP是通過TCP/IP），當(dāng)然我們也可以通過傳真，只要商家那邊也有傳真。
以上簡要介紹了HTTP協(xié)議的宏觀運作方式，下面介紹一下HTTP協(xié)議的內(nèi)部操作過程。
在WWW中，“客戶”與“服務(wù)器”是一個相對的概念，只存在于一個特定的連接期間，即在某個連接中的客戶在另一個連接中可能作為服務(wù)器。基于HTTP協(xié)議的客戶/服務(wù)器模式的信息交換過程，它分四個過程：建立連接、發(fā)送請求信息、發(fā)送響應(yīng)信息、關(guān)閉連接。這就好像上面的例子，我們電話訂貨的全過程。
其實簡單說就是任何服務(wù)器除了包括HTML文件以外，還有一個HTTP駐留程序，用于響應(yīng)用戶請求。你的瀏覽器是HTTP客戶，向服務(wù)器發(fā)送請求，當(dāng)瀏覽器中輸入了一個開始文件或點擊了一個超級鏈接時，瀏覽器就向服務(wù)器發(fā)送了HTTP請求，此請求被送往由IP地址指定的URL。駐留程序接收到請求，在進(jìn)行必要的操作后回送所要求的文件。在這一過程中，在網(wǎng)絡(luò)上發(fā)送和接收的數(shù)據(jù)已經(jīng)被分成一個或多個數(shù)據(jù)包（packet），每個數(shù)據(jù)包包括：要傳送的數(shù)據(jù)；控制信息，即告訴網(wǎng)絡(luò)怎樣處理數(shù)據(jù)包。TCP/IP決定了每個數(shù)據(jù)包的格式。如果事先不告訴你，你可能不會知道信息被分成用于傳輸和再重新組合起來的許多小塊。
也就是說商家除了擁有商品之外，它也有一個職員在接聽你的電話，當(dāng)你打電話的時候，你的聲音轉(zhuǎn)換成各種復(fù)雜的數(shù)據(jù)，通過電話線傳輸?shù)綄Ψ降碾娫挋C(jī)，對方的電話機(jī)又把各種復(fù)雜的數(shù)據(jù)轉(zhuǎn)換成聲音，使得對方商家的職員能夠明白你的請求。這個過程你不需要明白聲音是怎么轉(zhuǎn)換成復(fù)雜的數(shù)據(jù)的。
*請認(rèn)真填寫需求信息，我們會在24小時內(nèi)與您取得聯(lián)系。
