chrome.i18n

說明

資訊清單

如果擴充功能有 /_locales 目錄，則資訊清單必須定義 "default_locale"。

概念和用法

您需要將所有使用者可看到的字串放入名為 messages.json 的檔案中。每次新增語言代碼時，都會在名為 /_locales/_localeCode_ 的目錄下新增訊息檔案，其中「localeCode」localeCode是例如英文的 en 代碼。

以下是支援英文 (en)、西班牙文 (es) 和韓文 (ko) 的國際化擴充功能檔案階層：

支援多種語言

假設您的擴充功能如下圖所示：

如要將這個擴充功能國際化，請為使用者能查看的每個字串命名，然後放入訊息檔案中。擴充功能的資訊清單、CSS 檔案和 JavaScript 程式碼會使用每個字串的名稱取得其本地化版本。

擴充功能國際化後，看起來會像這樣 (請注意，它仍只有英文字串)：

<img "__msg_extname__",="" "default_locale"="" "en".="" "extname"."="" "hello="" _locates="" a="" alt="在 manifest.json 檔案, " and="" was="" changed="" chrome.i18n.getmessage("extname="1" item="18n.getmessage("extname="1" name="1" name="18n.getmessage("extname="1")" name="18n.getmessage="i)."g

國際化注意事項：

• 你可以使用系統支援的任何語言代碼。如果您使用不支援的語言代碼，Google Chrome 會忽略該語言代碼。

• 在 manifest.json 和 CSS 檔案中，參照名為 messagename 的字串，如下所示：

  __MSG_messagename__
  

• 在擴充功能或應用程式的 JavaScript 程式碼中，參照名為 messagename 的字串，如下所示：

  chrome.i18n.getMessage("messagename")
  

• 每次呼叫 getMessage() 時，您最多可提供 9 個字串加入訊息中。詳情請參閱範例：getMessage。

• 部分訊息 (例如 @@bidi_dir 和 @@ui_locale) 是由國際化系統提供。如需預先定義訊息名稱的完整清單，請參閱「預先定義的郵件」一節。

• 在 messages.json 中，每個使用者可看見的字串都有名稱、「訊息」項目和選用的「說明」項目。名稱是用來識別字串的鍵，例如「extName」或「search_string」。「message」指定這個語言代碼的字串值。選用的「說明」可協助譯者瞭解在擴充功能中使用字串的方式。例如：

  {
    "search_string": {
      "message": "hello%20world",
      "description": "The string we search for. Put %20 between words that go together."
    },
    ...
  }
  

詳情請參閱「格式：特定語言代碼訊息」。

一旦擴充功能完成國際化，即可透過簡單的方式進行翻譯。複製並翻譯 messages.json，然後將副本放入 /_locates 下的新目錄。舉例來說，如要支援西班牙文，只要在 /_locates/es 下加入 messages.json 的翻譯副本即可。下圖顯示舊版擴充功能，其中有新的西班牙文翻譯。

預先定義的訊息

國際化系統會提供幾種預先定義的訊息，協助您進行本地化。這些元素包括 @@ui_locale，以便您可以偵測目前的 UI 語言代碼，以及一些可讓您偵測文字方向的 @@bidi_... 訊息。後者的訊息名稱與小工具 BIDI (雙向) API 中的常數名稱相似。

無論擴充功能或應用程式是否已本地化，都可以在 CSS 和 JavaScript 檔案中使用特殊訊息 @@extension_id。這則訊息不適用於資訊清單檔案。

下表說明每則預先定義的訊息。

以下示範如何在 CSS 檔案中使用 @@extension_id 建立網址：

body {
  background-image:url('chrome-extension://__MSG_@@extension_id__/background.png');
}

如果擴充功能 ID 為 abcdefghijklmnopqrstuvwxyzabcdef，則先前程式碼片段中的粗體字會變成：

  background-image:url('chrome-extension://abcdefghijklmnopqrstuvwxyzabcdef/background.png');

以下是在 CSS 檔案中使用 @@bidi_* 訊息的範例：

body {
  direction: __MSG_@@bidi_dir__;
}

div#header {
  margin-bottom: 1.05em;
  overflow: hidden;
  padding-bottom: 1.5em;
  padding-__MSG_@@bidi_start_edge__: 0;
  padding-__MSG_@@bidi_end_edge__: 1.5em;
  position: relative;
}

如為由左至右書寫的語言 (例如英文)，粗體字會變成：

  dir: ltr;
  padding-left: 0;
  padding-right: 1.5em;

語言代碼

您可以選擇許多語言代碼，包括支援單一翻譯的多種變化語言 (例如 en)，例如 en_GB 和 en_US。

你可以將擴充功能本地化為 Chrome 線上應用程式商店支援的任何語言代碼。如果這裡未列出您的語言代碼，請選擇最接近的替代選項。舉例來說，如果擴充功能的預設語言代碼是 "de_CH"，請在 Chrome 線上應用程式商店中選擇 "de"。

搜尋訊息

您不必為每個支援的語言代碼定義所有字串。只要預設語言代碼的 messages.json 檔案每個字串都有一個值，無論譯文的剖析為何，您的擴充功能或應用程式都會執行。以下是擴充功能系統搜尋訊息的方式：

1. 搜尋訊息檔案 (如果有的話)，找出使用者偏好的語言代碼。舉例來說，如果 Google Chrome 的語言代碼設為英式英文 (en_GB)，系統會先在 /_locates/en_GB/messages.json 中尋找訊息。如果該檔案存在，且訊息確實存在，系統就不會再看到該檔案。
2. 如果使用者偏好的語言代碼有區域 (也就是語言代碼有底線: _)，請在沒有該區域的情況下搜尋語言代碼。舉例來說，如果 en_GB 訊息檔案不存在或未包含該訊息，系統會查看 en 訊息檔案。如果該檔案存在，且有訊息，系統就不會再找到。
3. 搜尋預設語言代碼的訊息檔案。舉例來說，如果擴充功能的「default_locale」設為「es」，且 /_locates/en_GB/messages.json 和 /_locates/en/messages.json 都不包含訊息，則擴充功能會使用 /_locates/es/messages.json 傳的訊息。

在下圖中，「colores」訊息位於擴充功能支援的全部三個語言代碼中，但「extName」只有兩個語言代碼才有。針對美國英文的 Google Chrome 使用者，會看到「顏色」標籤，英式英文使用者會看到「顏色」。英文 (美國) 和英國 (英文) 的使用者會看到擴充功能名稱「Hello World」。預設語言為西班牙文，因此，對於任何非英文執行 Google Chrome 的使用者，都會看到「Colores」標籤和「Hola mundo」標籤。

設定瀏覽器的語言代碼

如要測試翻譯結果，請設定瀏覽器的語言代碼。本節說明如何在 Windows、Mac OS X、Linux 和 ChromeOS 中設定語言代碼。

Windows

您可以使用特定語言代碼的捷徑或 Google Chrome UI 變更語言代碼。這個快速指令的方法設定完畢後就能更快，且可讓您一次使用多種語言。

使用特定語言代碼捷徑

如何建立及使用特定語言代碼來啟動 Google Chrome：

1. 複製桌面上現有的 Google Chrome 捷徑。
2. 根據新的語言代碼重新命名新的捷徑。

3. 變更捷徑的屬性，讓目標欄位指定 --lang 和 --user-data-dir 標記。目標應如下所示：

   path_to_chrome.exe --lang=locale --user-data-dir=c:\locale_profile_dir
   

4. 按兩下捷徑即可啟動 Google Chrome。

舉例來說，如要建立以西班牙文 (es) 啟動 Google Chrome 的捷徑，可建立名為 chrome-es 的捷徑，且目標如下：

path_to_chrome.exe --lang=es --user-data-dir=c:\chrome-profile-es

你可以視需要建立多個捷徑，輕鬆測試多種語言。舉例來說：

path_to_chrome.exe --lang=en --user-data-dir=c:\chrome-profile-en
path_to_chrome.exe --lang=en_GB --user-data-dir=c:\chrome-profile-en_GB
path_to_chrome.exe --lang=ko --user-data-dir=c:\chrome-profile-ko

使用 UI

以下說明如何在 Windows 版 Google Chrome 中，使用使用者介面變更語言代碼：

1. 應用程式圖示 >「選項」
2. 選擇「幕後設定」分頁標籤
3. 向下捲動至「網頁內容」
4. 按一下「變更字型和語言設定」。
5. 選擇「語言」分頁標籤
6. 使用下拉式選單設定 Google Chrome 語言
7. 重新啟動 Chrome

Mac OS X

如要變更 Mac 的語言，請使用系統偏好設定。

1. 在 Apple 選單中選擇「System Preferences」。
2. 在「個人」部分下方，選擇「國際」。
3. 選擇語言和地區
4. 重新啟動 Chrome

Linux

如要變更 Linux 的語言，請先關閉 Google Chrome。接著，在同一行設定 LANGUAGE 環境變數，然後啟動 Google Chrome。例如：

LANGUAGE=es ./chrome

ChromeOS

如何變更 ChromeOS 的語言代碼：

1. 在系統匣中，選擇「設定」。
2. 在「語言與輸入法」部分中，選擇「語言」下拉式選單。
3. 如果畫面上未列出所需語言，請按一下「新增語言」並加入所需語言。
4. 新增完畢後，按一下語言旁邊的三點「更多動作」選單項目，然後選擇「以這個語言顯示 ChromeOS」。
5. 按一下設定語言旁邊的「重新啟動」按鈕，重新啟動 ChromeOS。

示例

您可以在 examples/api/i18n 目錄中找到國際化的簡單範例。如需完整範例，請參閱 examples/extensions/news。如需其他範例及查看原始碼的相關說明，請參閱範例。

getMessage()

下列程式碼會從瀏覽器取得本地化訊息，並以字串顯示。這會將訊息中的兩個預留位置替換成「string1」和「string2」字串。

function getMessage() {
  var message = chrome.i18n.getMessage("click_here", ["string1", "string2"]);
  document.getElementById("languageSpan").innerHTML = message;
}

以下說明如何提供及使用單一字串：

  // In JavaScript code
  status.innerText = chrome.i18n.getMessage("error", errorDetails);

"error": {
  "message": "Error: $details$",
  "description": "Generic error template. Expects error parameter to be passed in.",
  "placeholders": {
    "details": {
      "content": "$1",
      "example": "Failed to fetch RSS feed."
    }
  }
}

如要進一步瞭解預留位置，請參閱「當地專屬訊息」頁面。如要進一步瞭解如何呼叫 getMessage()，請參閱 API 參考資料。

getAcceptLanguages()

下列程式碼會取得瀏覽器中的接受語言，並以字串形式顯示 (以「,」分隔)。

function getAcceptLanguages() {
  chrome.i18n.getAcceptLanguages(function(languageList) {
    var languages = languageList.join(",");
    document.getElementById("languageSpan").innerHTML = languages;
  })
}

如要進一步瞭解如何呼叫 getAcceptLanguages()，請參閱 API 參考資料。

detectLanguage()

下列程式碼會從指定字串偵測最多 3 種語言，並以新行分隔的字串來顯示結果。

function detectLanguage(inputText) {
  chrome.i18n.detectLanguage(inputText, function(result) {
    var outputLang = "Detected Language: ";
    var outputPercent = "Language Percentage: ";
    for(i = 0; i < result.languages.length; i++) {
      outputLang += result.languages[i].language + " ";
      outputPercent +=result.languages[i].percentage + " ";
    }
    document.getElementById("languageSpan").innerHTML = outputLang + "\n" + outputPercent + "\nReliable: " + result.isReliable;
  });
}

如要進一步瞭解如何呼叫 detectLanguage(inputText)，請參閱 API 參考資料。

chrome.i18n.detectLanguage(
  text: string,
  callback?: function,
)

chrome.i18n.getAcceptLanguages(
  callback?: function,
)

chrome.i18n.getMessage(
  messageName: string,
  substitutions?: any,
  options?: object,
)

chrome.i18n.getUILanguage()