關于瀏覽器亂碼的淺談

在瀏覽器上查看網頁,偶爾會看到一些網站出現亂碼的情況。關于瀏覽器展示亂碼,這里做個簡單的介紹。

認識幾種編碼方式

ASCII

全稱美國標準信息交換代碼(American Standard Code for Information Interchange)的縮寫, 為美國英語通信所設計。它由128個字符組成,包括大小寫字母、數字0-9、標點符號、非打印字符(換行符、制表符等4個)以及控制字符(退格、響鈴等)組成,每個字符占7位(1字節是8位)。

ISOLatin-1

可以認為ASCII是美國發明針對英語設計的,但歐洲人在用的時候出現了問題。對于一些特殊的拉丁字符,比如法文德文里某些字符,ASCII字符集就不包括。于是歐洲人發明了一種8位字符集是ISO 8859-1Latin 1,也簡稱為ISOLatin-1。它對ASCII做了個擴充,對于0-127之間的字符還使用ASCII里的字符不變, 把位于128-255之間的字符表示拉丁字母表中特殊語言字符。

UNICODE

后來計算機不斷發展擴展到亞洲非洲,如何用計算機使用的二進制表示這些語言又成了問題。ISOLatin-1的8位字符集只能表示256個字符,而僅漢語就有80000以上個字符。如何把地球上絕大多數語言用一種編碼方式表示出來呢? 于是發明了UNICODE編碼,只用2個字節(16位)就可以編碼地球上幾乎所有地區的文字。但是,UNICODE只是理論上的編碼方式,相當于給世界上每個文字打了個編號,但這編號具體如何在計算機里面存儲,可以有多種實現方式。比如utf-8和gbk。
前面說了UNICODE只是給每個文字打了個編號,為啥不把這個編號直接轉化成二進制存儲在計算機里面呢? 比如英文字母s的編號是115, 用二進制表示是00000000 1110011, 中文的編號是26085(16進制是65e5) ,二進制是11001011 1100101。老外才沒那么傻,對于老外這種日常純粹是用英文字符的人來說明明之前1個字節就能存儲一個字母,現在為了全球大一統非要存儲為2個字節,相當于一個之前一個1M的文檔,現在變為2M。于是老外耍了賴,英文字母s115沒錯,但我就用1個字節1110011表示,而你中文26085號也沒錯,但是你不能在使用2個表示,而是用2個甚至6個字節表示。(為了英文的特權,犧牲其他語言的存儲空間的便利),這個編碼方式就是UTF-8。

UTF-8

utf-8(8-bit Unicode Transformation Format)是一種針對Unicode的可變長度字符編碼,又稱萬國碼。UTF-8用1到6個字節編碼UNICODE字符。用在網頁上可以同一頁面顯示中文簡體繁體及其它語言(如英文,日文,韓文)。
那GBK又是如何產生的呢?

GBK

這時候中國不干了,為啥你制定了全球大一統的規則,卻為了自己的便利又破壞規則,把方便留給自己不便留給別人呢? 明明用2個字節就能表示中文一個漢字,現在UTF-8編碼中文竟然需要2個甚至4個字節來表示。于是中國制定一套自己的規則,于是用2個字節來表示一個漢字,總共可以覆蓋2萬多個文字。 對于英文,好吧讓一步,還保留和你UTF-8同樣的方式使用一個字節來表示。
記住:UNICODE只是給字符一個代號,而GBK和UTF-8使用不同的規則來表示同一個代號。

網頁亂碼如何產生

下面這個流程是我們寫入文件到展示文件的簡單描述:
我們使用編輯器編寫 HTML 文件
保存編寫的HTML文件
使用瀏覽器打開HTML文件
HTML文件在瀏覽器展示

亂碼產生的根源就在與第2步驟和第4步。

在第2步保持文件時會把我們寫入的文字使用編輯器默認的編碼方式進行保存。如果大家使用的是Sublime編輯器,默認的編碼方式是utf-8。當然也可以安裝GBK Encoding support插件,在保存文件時可選擇保存為GBK


在第4步瀏覽器打開網頁時,它并不知道你的這個文件是使用什么編碼方式,于是自作主張使用了默認解碼方式。如下圖所示,文件保存為GBK格式,在Chrome打開時默認使用 ISO -8859的解碼方式,導致編碼和解碼不匹配,產生亂碼。

那如何規避這個問題呢?即如何通知瀏覽器用什么方式解碼呢?

首頁,在文件保存的時候你自己要清楚是用哪種編碼方式保存的(sublime默認保存方式是utf-8,如果安裝了插件也可另存為gbk,其它IDE可以做設置保存格式)。如果你的文件是保存為utf-8格式,那么一定要在html 的 <head>
里添加<meta charset="utf-8">,這句話的意思是告訴瀏覽器在打開這個頁面的時候不要去猜了,直接用utf-8去解碼。 同理,如果你的文件保存為gbk格式,一定在文件里添加<meta charset="gbk">
記住,
1.亂碼產生的根本原因是你保存的編碼格式和瀏覽器解析時的解碼格式不匹配導致的。
2.亂碼一般是英文以外的字符才會出現。

為啥純粹的英文不會出現亂碼問題,即使編碼方式和解碼方式不一致?那是因為前面講過了 utf-8、gbk對英文都是采用1個字節的編碼方式,并且使用了相同的碼字。
參考
百度百科
知乎

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容