March 18, 2015

用 javascript 讀入、輸出 ANSI 與 UTF-8 編碼的檔案

有些軟體(例如 Microsoft Office )預設是以 ANSI 開啟與儲存檔案,而有些軟體(例如 Sublime Text)或作業系統(例如 OSX)預設則是 Unicode,不同軟體間不同的編碼方式,造成工程師許多不必要的困擾。

這個簡單的小程式示範如何用 javascript 讀入、輸出 ANSI 與 UTF-8 編碼的檔案。

overview.png


目錄


(一) 問題背景

有些軟體(例如 Microsoft Office )預設是以 ANSI 開啟與儲存檔案,而有些軟體(例如 Sublime Text)或作業系統(例如 OSX)預設則是 Unicode,不同軟體間不同的編碼方式,造成工程師許多不必要的困擾。

這個簡單的小程式示範如何用 javascript 讀入、輸出 ANSI 與 UTF-8 編碼的檔案。

程式碼請參照 Github

(二) Demo

Demo page:

Sample files:

(三) 使用方式

  1. 選取輸入的檔案編碼(ANSI, UTF-8)
  2. 選取輸出的檔案編碼(UTF-8 with/without BOM)
  3. 選擇輸入的檔案
  4. 看看讀取結果是否有正常,或是亂碼
  5. 下載輸出的檔案,看看結果是否正常,或是亂碼

(四) 結論

若欲讀入的檔案為 ANSI 編碼(例如 big5):

reader.readAsText(file, ‘big5’);

若欲讀入的檔案為 UTF-8 編碼:

reader.readAsText(file);

若欲輸出的檔案為 UTF-8 ( 無 BOM )

不用做任何動作

若欲輸出的檔案為 UTF-8 ( 有 BOM )

在輸出端開頭加入 '\uFEFF'

註:大部份預設 ANSI 模式的軟體,看到 UTF-8 的 BOM 後,都能正確的以 UTF-8 開啟,故輸出含 BOM 的 UTF-8 即可達成我們的目的。

(五) Reference


(六) 延伸閱讀