公開日: 2024 年 11 月 13 日、最終更新日: 2025 年 5 月 20 日
商品の解説 | ウェブ | 拡張機能 | Chrome のステータス | インテント |
---|---|---|---|---|
GitHub | 表示 | テストの目的 |
Chrome の Translator API を使用して、ブラウザで提供される AI モデルでテキストを翻訳します。
世界中のユーザーがアクセスできるように、ウェブサイトのコンテンツを複数の言語で提供している場合もあります。Translator API を使用すると、ユーザーは母国語で貢献できます。たとえば、ユーザーは母国語でサポート チャットに参加できます。そのチャットは、ユーザーのデバイスから送信される前に、サポート エージェントが使用する言語に翻訳されます。これにより、すべてのユーザーがスムーズで高速かつ包括的なエクスペリエンスを得ることができます。
ウェブ上のコンテンツを翻訳するには、通常、クラウド サービスを使用する必要があります。まず、ソース コンテンツがサーバーにアップロードされ、ターゲット言語への翻訳が実行されます。次に、結果のテキストがダウンロードされ、ユーザーに返されます。クライアントで翻訳を実行すると、サーバー トリップに必要な時間と翻訳サービスのホスティング費用を節約できます。
使ってみる
Translator API は Chrome 138 安定版から利用できます。まず、機能検出を実行して、ブラウザが Translator API をサポートしているかどうかを確認します。
if ('Translator' in self) {
// The Translator API is supported.
}
翻訳のターゲット言語は常に把握できますが、ソース言語は必ずしも把握できない場合があります。このような場合は、Language Detector API を使用できます。
ハードウェア要件を確認する
Language Detector API と Translator API は、パソコンの Chrome でのみ動作します。
Prompt API、Summarizer API、Writer API、Rewriter API は、次の条件を満たしている場合に Chrome で動作します。
- オペレーティング システム: Windows 10 または 11、macOS 13 以降(Ventura 以降)、Linux。Android、iOS、ChromeOS 版 Chrome は、Gemini Nano を基盤とする API ではまだサポートされていません。
- ストレージ: Chrome プロファイルを含むボリュームに 22 GB 以上の空き容量。
- GPU: 4 GB を超える VRAM が必要です。
- ネットワーク: データ通信量無制限または無制限接続。
- GPU: 4 GB を超える VRAM が必要です。
- ネットワーク: データ通信量無制限または無制限接続。
これらの要件は、開発プロセスと、作成した機能を利用するユーザーに存在します。
言語ペアのサポートを確認する
翻訳は、オンデマンドでダウンロードされる言語パックで管理されます。言語パックとは、特定の言語の辞書のようなものです。
sourceLanguage
: テキストの現在の言語。targetLanguage
: テキストを翻訳する最終的な言語。
BCP 47 言語のショートコードを文字列として使用します。たとえば、スペイン語の場合は 'es'
、フランス語の場合は 'fr'
です。
const translatorCapabilities = await Translator.availability({
sourceLanguage: 'es',
targetLanguage: 'fr',
});
// 'available'
availability()
関数は、次の値を持つ Promise を返します。
"unavailable"
: 実装で、指定された言語の翻訳または言語検出がサポートされていません。"downloadable"
: 実装では、指定された言語の翻訳または言語検出がサポートされていますが、続行するにはダウンロードが必要です。ダウンロードはブラウザ モデルである可能性があります。"downloading"
: 実装は、指定された言語の翻訳または言語検出をサポートしています。ブラウザが、関連するオブジェクトの作成の一環として、進行中のダウンロードを完了しています。"available"
: 実装は、指定された言語の翻訳または言語検出をサポートしており、必要なダウンロードはすでに完了しています。
downloadprogress
イベントを使用して、モデルのダウンロードの進行状況をリッスンします。
const translator = await Translator.create({
sourceLanguage: 'es',
targetLanguage: 'fr',
monitor(m) {
m.addEventListener('downloadprogress', (e) => {
console.log(`Downloaded ${e.loaded * 100}%`);
});
},
});
ダウンロードに失敗すると、downloadprogress
イベントが停止し、ready
Promise が拒否されます。
翻訳ツールを作成して実行する
トランスレータを作成するには、非同期の create()
関数を呼び出します。sourceLanguage
と targetLanguage
の 2 つのフィールドを含むオプション パラメータが必要です。
// Create a translator that translates from English to French.
const translator = await Translator.create({
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 ?"
連続翻訳
翻訳は順番に処理されます。大量のテキストを翻訳に送信すると、前の翻訳が完了するまで後続の翻訳はブロックされます。
リクエストに最適な応答を得るには、リクエストをチャンクにまとめ、スピナーなどの読み込みインターフェースを追加して、翻訳が進行中であることを伝えます。
デモ
Language Detector API と組み合わせて使用される Translator API は、Translator and Language Detector API のプレイグラウンドで確認できます。
標準化の取り組み
Google は、クロスブラウザの互換性を確保するため、Translator API の標準化に取り組んでいます。
Google の API 提案はコミュニティのサポートを受け、W3C ウェブ インキュベーター コミュニティ グループに移行され、さらに議論されています。Chrome チームは W3C 技術アーキテクチャ グループにフィードバックをリクエストし、Mozilla と WebKit に標準に関する立場を尋ねました。
標準化作業に参加するには、ウェブ インキュベーター コミュニティ グループに参加してください。
フィードバックを共有
Language Detector API を使って作成したアプリをぜひお見せください。ウェブサイトやウェブ アプリケーションを X、YouTube、LinkedIn で共有してください。