【茶包射手日記】Win7 + Chrome 才看得到的網頁特殊字元

使用者報案網頁多了一個像 L 的字元,在同事的電腦可重現,但在我的機器卻看不到。進一步測試,發現這個像 L 的字元在同事的 Windows 7 要用 Chrome 才會出現,用 IE 看不到;而在我的 Windows 10 上,不管用 Chrome、IE 還是 Firefox 都看不到。透過 F12 開發者工具鎖定可疑字元,複製貼上到中文編碼解析工具,發現原來是 ASCII 0x03 字元,有可能是網頁製作者從 Office 文件複製貼上被夾帶過來的。ASCII 0x03 這類控制碼字元,看不見是合理的,為何在 Win7 + Chrome 會現形則是個謎。

於是我寫了一個測試網頁,列舉從 ASCII 01-65("A") 的 65 個字元。

StringBuilder sb = new StringBuilder();
sb.AppendLine("<html><body><table>");
for (int i = 1; i < 65; i++)
{
    char c = (char) i;
    sb.AppendLine($"<tr><td>{i}</td><td>{c}</td></tr>");
}
sb.AppendLine("</table></body></html>");
System.IO.File.WriteAllText("e:\\ASCII.html", sb.ToString());

用 Notepad++ 看會像這樣,那些 SOH、STX、ETX 就是 ASCII 32 以下的隱形控制字元。

用我的電腦實測,不管 Chrome、IE 還是 Firefox,都看不到空白字 (ASCII 32) 之前的控制字元。

改用 Windows 7 + Chrome 檢視,原本該隱形的字元都冒出來了。如下圖,ASCII 1-4 分別是方框的左上、右上、左下、右下角,問題網頁內容的 ASCII 3 是左下角,才被使用者誤認為 L。進一步使用 F12 開發者工具檢查,得知關鍵在於 ASCII 控制碼所在的 <TD> 使用了 Gulim 這個字型,Gulim 這個韓文字型有個特色,ASCII 控制碼被對應到可見的特殊符號,造成我們遇到的狀況。

我查不到關於 Chrome 此一行為的官方說明,由找到的文章,Gulim 似乎是 Windows 7 Chrome 針對 CJK(中日韓) 字型無對應時的 Fallback 字型。參考:

  • 最佳 Web 中文默認字體 - 問問題
    ... 在英文 Win7 下,只要 charset=“gbk”, 當 font-family 為 arial, sans-serif 時, 是 fallback 到瞭韓文字體 Dotum/Gulim(gulim.ttc)來顯示 ...
  • Chrome 3.0的字有夠醜! – 蘋果豬日記V4
    ... 把Arialuni殺掉之後,接下來fallback的順序依序是:Arial Unicode > Simsun > Gulim > MS Gothic > Mingliu
    分別是Unicode預設>簡體中文預設>韓文預設>日文預設>正體中文預設。...

由以上這些線索,大致可以推論「在 Win 7 Chrome 中,小於 ASCII 32 的控制字元會使用 Gulim 這個字型顯示而變成可見的符號。」

結案~

歡迎推文分享:
Published 04 November 2017 10:10 AM 由 Jeffrey
Filed under:
Views: 2,603



意見

沒有意見

你的看法呢?

(必要的) 
(必要的) 
(選擇性的)
(必要的) 
(提醒: 因快取機制,您的留言幾分鐘後才會顯示在網站,請耐心稍候)

5 + 3 =

搜尋

Go

<November 2017>
SunMonTueWedThuFriSat
2930311234
567891011
12131415161718
19202122232425
262728293012
3456789
 
RSS
創用 CC 授權條款
【廣告】
twMVC

Tags 分類檢視
關於作者

一個醉心技術又酷愛分享的Coding魔人,十年的IT職場生涯,寫過系統、管過專案, 也帶過團隊,最後還是無怨無悔地選擇了技術鑽研這條路,近年來則以做一個"有為的中年人"自許。

文章典藏
其他功能

這個部落格


Syndication