瀏覽器大亂鬥:蘋果 vs 微軟 vs 谷歌 vs Mozilla

語言: CN / TW / HK

本文來自微信公眾號: 差評(ID:chaping321) ,作者:差評君,原文標題:《微軟帶頭打了30年,這場螢幕裡的大亂鬥,終於要結束了。。。》,題圖來自:《斯巴達300勇士》

最近有這麼一條新聞:蘋果、微軟、谷歌和 Mozilla 這幾大瀏覽器製造商宣佈將要聯合起來,解決網頁適配問題了。

由於這個“聯合軍”幾乎包括了所有主要的瀏覽器供應商,隨著他們的協作,程式設計師們的工作將大大減少,而網民們也將擁有更舒適、統一的瀏覽體驗。

像下面這樣一些比較奇怪的頁面效果,將不復存在。

畸形的影象顯示(左圖)

很不對頭的動畫效果

不按預期出牌的粘性表頭

之所以不同網站在不同瀏覽器上的顯示或互動效果不同,是因為不同的瀏覽器對同一段程式碼有不同的解析。

如果網站不針對不同瀏覽器做適配,那使用者體驗就會直接爆炸。

其實,為了解決不同瀏覽器各自為營導致的相容、適配問題,從瀏覽器誕生之初,各個巨頭就沒少折騰。

其中非常有趣的一件事情,是由微軟掀起的,俗稱 UA 大混戰的“戰役”。

今天咱們就來聊聊這個事情。

幾乎所有的瀏覽器, UA 開頭都是 Mozilla

在正式開始之前,別急著問 UA 是啥,先聽一個小故事。

約 30 年前,第一次“瀏覽器世界大戰”時,微軟跟 Netscape 槓上了。

Netscape,即大名鼎鼎的網景,他們的瀏覽器名為網景導航者 (Netscape Navigator)  ,內部代號為 Mozilla 。

就像大家現在看到 IE 瀏覽器的圖示會想到上網一樣,當年大家上網不說上網,而是說上網景。

因為當時的網景整了很多創新之舉,比如搭載 Cookie 、支援 JavaScript 指令碼以及 Frames 技術,功能非常強大,飽受網蟲歡迎。

就 Frames 技術來說,它使得瀏覽器視窗能同時顯示多個網頁,每個 Frame 裡可以放一個網頁,網頁相互獨立。

放到今天,大家看起來肯定感覺:就這???

但在網際網路早期,網頁基本上就是一行行的字跟簡單的圖片構成的。像下圖一樣。

相比之下,Frames 賦予了網頁更強大的實用性、便捷性,瞬間流行了起來。

正是因為前述不同瀏覽器之間巨大的特性差異,用誇張手法來說,網景都支援像 Frames 這樣的高階特性了,有的瀏覽器可能連圖片顯示都還沒支援。

對於網站來說,給不支援 Frames 的網站,返回帶 Frames 的頁面顯然是不合適的。

於是,User Agent 嗅探誕生了。

UA 是什麼東西呢?

UA 就是瀏覽器的“身份證”,上面有瀏覽器的身份資訊,把它遞給網站,網站就知道你是誰,能做啥 (比如能不能顯示圖片) ,然後給你返回對應的網頁。

比如下面是一個 Netscape 的 UA ,網站看到 Mozilla/1.0 就知道瀏覽器跟瀏覽器的版本號,看到後面的 Win3.1 就能知道相關作業系統。

Mozilla/1.0 ( Win3.1 ) 

UA 識別到這是網景瀏覽器以後,網站服務端表示,這個瀏覽器很厲害啊!我要給他發一個高階的頁面。

如果是其他瀏覽器,那網站服務端就會發一個普通的頁面過去,畢竟,萬一發去高階的,它不支援怎麼辦?

當時的微軟已經是大公司了,手底下有一批優秀的軟體工程師專門做 IE 瀏覽器,很多功能並不比網景落後,像 Frames 這些 IE 也有。

IE 1.0

但很可惜,IE 當時還是一個“新生兒”,儘管它支援高特性的網頁,但網站卻沒有給 IE 做適配,給它返回的是普通網頁。

可是 IE 已經等不及了,它迫切的提想要打敗網景,奪下這片市場,所以它決定 —— “騙”。

你不是通過識別 UA 來判斷返回什麼網頁麼?好,那我就披一層網景的衣服,假裝是網景,騙你給我高特性的網頁!

靠著種種手段,比如捆綁銷售,IE 的佔有率節節攀升,到 IE 4.0 的時候,微軟基本上是把網景打趴下。

IE 4.0

但網景也沒有完全認輸,在被收購之前公開了原始碼,還用最初開發代號 Mozilla 建立了 Mozilla 組織。

火狐瀏覽器就是這個組織的產物。

為了跟之前的網景瀏覽器相區分,火狐在之前 UA 的基礎上,加入了自己的標識:Firefox 。

同時 Mozilla 還寫了一個叫 Gecko 的排版引擎,這個渲染引擎非常厲害,火狐也把它加入到了自己的 UA 之中。

跟之前一樣,網站也知道用 Gecko 引擎的瀏覽器會比較厲害,花活比較多,於是會為它準備更高階的頁面,為其他瀏覽器準備普通頁面。

其他瀏覽器也很苦惱,從技術層面我們明明也能實現這些,只是網站沒給機會,於是也開始偽造“身份證”。

戲劇性的一幕出現了: 所有瀏覽器都開始偽裝自己是 Mozilla 。

首先是 Linux 的追隨者,他們編寫了 Konqueror,引擎是 KHTML。

這群人認為 KHTML 跟 Gecko 一樣好,但是網站卻不給他們返回好的頁面,於是開始偽裝自己,還在 UA 裡寫下我們跟 Gecko 一樣好。

 UA = Mozilla/5.0 (compatible; Konqueror/3.2; FreeBSD) 
 
(KHTML, like Gecko) 

而蘋果家的 Safari 呢,它基於 KHTML 引擎,但是加了新的特性,所以另起爐灶叫自己 WebKit 。

但同時,Safari 也不想失去那些為 KHTML 編寫的東西,所以它也選擇延續前面的 UA ,再加一點標識。

Mozilla/5.0 (Macintosh; U; PPC Mac OS X; de-de)  AppleWebKit /85.7 (KHTML, like Gecko) Safari/85.5 

而咱們現在最常用的 Chrome 瀏覽器呢,則是基於 WebKit 開發的,但也是做了修改,跟前人一樣,也不想失去那些為 WebKit 編寫的東西。

於是在 UA 中,他把自己偽裝成這樣:

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

總之,無限套娃。

最後,人人都不是 Mozilla,人人都是 Mozilla。

圍繞 UA 的騷操作還有很多,比如有些人明明用的是手機瀏覽器刷網頁,但會通過修改 UA ,騙網站:“我是電腦!給我發對應的網頁來。”

這樣一來,就能規避手機網頁中那些“開啟 XX APP,檢視全部 XX 評論”的攔截了。

比如之前優酷對 iPhone 端的瀏覽器是不提供視訊廣告的。

於是樂視瀏覽器就通過修改 UA ,騙優酷自己是 iPhone ,以獲取沒有廣告的優酷視訊。

除了離譜的 UA 之外,瀏覽器之間因為各自為營,還衍生了各種“相容模式”“相容外掛”。

哎,為什麼,直到現在瀏覽器才想起來要“統一標準”這件事兒呢?

差評君猜測主要是兩方面:

一方面是公開統一的標準推行起來很慢,畢竟涉及到的廠商很多,而廠商們為了迅速搶佔市場,往往會想要“立刻”提升使用者體驗。

另一方面是,如果大家都統一,就失去了自己獨特的優勢,從產品淪為工具。

而在現在瀏覽器主要功能都大差不差,趨向穩定,很難在技術上有跨時代的突破,再糾結於自家標準,意義已經不大了。更多的是給程式設計師,給使用者帶來的不便,還不如走向統一。

而曾經圍繞 IE 瀏覽器的打響的,屬於電腦螢幕中的兩次“世界大戰”,也以群雄割據,統一標準的局面走向了尾聲。

部分圖片、資料來源:

docstore.mik.ua/orelly/web/html/ch02_11.html

webaim.org/blog/user-agent-string-history

web.dev/compat2021/

copyfuture.com/blogs-details/2020081018354620389ly35dtlleop0u

www.ip138.com/useragent/

本文來自微信公眾號: 差評(ID:chaping321) ,作者:差評君