使用內建 AI 翻譯

發布日期:2024 年 11 月 13 日

使用 Chrome 中的 Translator API,透過本機 AI 模型在瀏覽器中翻譯文字。

你的網站可能已經提供多種語言的網站內容,讓全球觀眾都能存取。使用者可透過 Translator API 以母語進行貢獻。舉例來說,使用者可以使用第一語言參與支援聊天,而您的網站會將訊息翻譯成支援專員使用的語言,然後傳送給使用者。這麼做可為所有使用者提供流暢、快速且無障礙的體驗。

過去,要翻譯網站上的內容,通常必須使用雲端服務。首先,來源內容會上傳至伺服器,然後執行翻譯至目標語言的作業,接著下載結果文字並傳回給使用者。在用戶端上執行翻譯作業,可節省伺服器行程所需的時間,以及代管翻譯服務的費用。

可用性

雖然系統一向會知道所選的目標語言,但在某些情況下,原文語言可能無法得知,例如使用者自製內容。在這種情況下,Translator API 提案會同時包含 Translator API 和 Language Detector API,後者也適用於原始試用版。請註冊這兩項來源試用,以便同時使用這些 API。

註冊試用來源

如要開始使用 Translator API,請按照下列步驟操作:

  1. 確認瞭解 Google 的生成式 AI 使用限制政策
  2. 前往 Translator API 來源試用
  3. 按一下「註冊」並填寫表單。
    • 在「Web origin」欄位中,提供來源或擴充功能 ID chrome-extension://YOUR_EXTENSION_ID
  4. 按一下「註冊」即可提交。
  5. 複製提供的符記,並將其新增至您要啟用試用版的來源或擴充功能檔案中的每個網頁。
  6. 開始使用 Translator API

進一步瞭解如何開始使用來源試驗

為 localhost 新增支援

如要在來源試用期間,在 localhost 上存取 Translator API,您必須將 Chrome 更新至最新版本。接下來,請按照下列步驟進行:

  1. 在 Windows、Mac 或 Linux 等平台上開啟 Chrome。
  2. 前往chrome://flags/#translation-api
  3. 選取「已啟用」
    • 如果您想嘗試多種語言配對,請選取「已啟用,不受語言套件限制」
  4. 按一下「重新啟動」或重新啟動 Chrome。

使用 Translator API

如要判斷是否支援 Translator API,請執行下列功能偵測程式碼片段。

if ('translation' in self && 'createTranslator' in self.translation) {
  // The Translator API is supported.
}

確認語言組合支援

翻譯功能會透過語言套件進行管理,並視需要下載。語言包就像特定語言的字典。這些套件會搭配非同步 canTranslate() 函式,讓您判斷系統是否支援某個語言組合。

canTranslate() 函式需要 options 參數,其中包含兩個欄位:

  • sourceLanguage:文字目前的語言。
  • targetLanguage:文字應翻譯成最終語言。

使用 BCP 47 語言代碼做為字串。例如 'es' (西班牙文) 或 'fr' (法文)。

await translation.canTranslate({
  sourceLanguage: 'en',
  targetLanguage: 'fr',
});
// 'readily'

canTranslate() 函式可傳回下列任一結果:

  • no:這個瀏覽器無法依要求進行翻譯。
  • readily:瀏覽器可依要求進行翻譯。
  • after-download:瀏覽器必須先下載相關模型或語言套件,才能執行翻譯作業。

您可以使用 downloadprogress 事件監聽下載進度:

translator.ondownloadprogress = progressEvent => {
  updateDownloadProgressBar(progressEvent.loaded, progressEvent.total);
};

如果下載失敗,系統就會停止發出 downloadprogress 事件,並拒絕 ready 應許。

建立及執行翻譯器

如要建立翻譯器,請呼叫非同步 translation.createTranslator() 函式。與 canTranslate() 一樣,它需要一個含有兩個欄位的選項參數,一個用於 sourceLanguage,另一個用於 targetLanguage

// Create a translator that translates from English to French.
const translator = await self.translation.createTranslator({
  sourceLanguage: 'en',
  targetLanguage: 'fr',
});

取得翻譯器後,請呼叫非同步 translate() 函式來翻譯文字。

await translator.translate('Where is the next bus stop, please?');
// "Où est le prochain arrêt de bus, s'il vous plaît ?"

來源試驗的限制

以下限制適用於原始試用方案。

支援的語言組合

目前最多可下載三個語言套件進行翻譯。我們承諾在日後的版本中擴大支援的語言範圍,同時維持使用者隱私權的高標準。您可以使用 canTranslate() 函式,確認所需語言組合是否受支援。

某些較不常使用的語言組合可能會用於指紋記錄。舉例來說,英文和西班牙文之間的翻譯比起較不常見的語言 (例如蓋爾語和加泰隆尼亞語) 更常見。較不常見的語言組合可能會視為使用者身分識別的資料點。

在原始試用期間,我們會限制可翻譯的語言組合,以保護使用者隱私。語言組合必須符合下列條件:

  • 來源語言和目標語言都會在 Chrome 中設為偏好語言
  • 或者,其中一種語言已在 Chrome 中設為偏好語言,而另一種語言則是下列熱門語言之一:
    • 英文 (en)
    • 中文 (zh;簡體) 或中文 (zh-Hant;繁體)
    • 日文 (ja)
    • 葡萄牙文 (pt)
    • 俄文 (ru)
    • 西班牙文 (es)
    • 土耳其文 (tr)
    • 北印度文 (hi)
    • 越南文 (vi)
    • 孟加拉文 (bn)

在本機測試中略過語言限制

針對本機原型設計,您可以使用指令列選項 --disable-features=TranslationAPIAcceptLanguagesCheck 執行 Chrome,藉此略過這些檢查。您也可以將 chrome://flags/#translation-api 設為「Enable without language pack limit」

請前往 chrome://on-device-translation-internals/ 手動安裝及解除安裝語言套件。

依序翻譯

系統會依序處理翻譯作業。如果您傳送大量文字進行翻譯,系統會先完成先前的翻譯作業,再處理後續的翻譯作業。

為確保翻譯要求的回應速度最佳化,請將翻譯要求分成多個部分,並考慮顯示載入介面 (例如旋轉圖示),以表示翻譯作業正在進行中。

Web worker 可用性

在來源試用期間,Translator API 僅支援主執行緒。我們預計在 API 廣泛推出後,在網路工作者中支援這項功能。

示範

您可以在 Translator 和 Language Detector API 遊樂場中,查看與 Language Detector API 搭配使用的 Translator API。

標準化作業

我們正在努力將 Translator API 標準化,以確保跨瀏覽器的相容性。

我們的 API 提案獲得社群支持,並已移至 W3C Web Incubator 社群群組進行進一步討論。Chrome 團隊向 W3C 技術架構小組索取意見回饋,並請 MozillaWebKit 提供標準立場。

參與並提供意見回饋

立即加入來源試用計畫,開始測試 Translator API,並提供寶貴意見。您的意見回饋會直接影響我們建構及實作此 API 後續版本,以及所有內建 AI API 的方式。