Web_Speech_APIでサポートしてる言語がわからないです

Question

##目的
ブラウザで簡単な音声合成するためのコードを書こうとしており、中国語がサポートされているか知りたいです。

##やったこと・知りたいこと
そこでこちらの下の方にある「仕様」のWeb Speech APIから「supported language」のような項目を探したのですが、このAPIでサポートされている言語が見つけられませんでした。どなたかどこに書いてあるか教えていただけますでしょうか。よろしくお願いいたします。

Answer 1

※直接的な回答とはなっていないのですが、参考として

APIの各情報はあくまでインターフェースであって、実際の言語サポートの仕方については実装をしているブラウザに依存すると思います。
音声合成等をローカルで行う関係上、ブラウザだけでなくOSなどの影響もあります。

---

対応言語ではなく合成時の音ソース単位であれば、speechSynthesis.getVoicesで音声データのオブジェクトのリストを取得できます。
このオブジェクトには、内部の名称や言語を確認することができます。

ブラウザの開発ツール上にあるコンソールで以下のコードを実行すると、

const ut = new SpeechSynthesisUtterance();
ut.text = 'hello';
speechSynthesis.getVoices();

以下のような結果を取れます。

• 0: SpeechSynthesisVoice { voiceURI: "urn:moz-tts:sapi:Microsoft Haruka Desktop - Japanese?ja-JP", name: "Microsoft Haruka Desktop - Japanese", lang: "ja-JP", … }​
• 1: SpeechSynthesisVoice { voiceURI: "urn:moz-tts:sapi:Microsoft Zira Desktop - English (United States)?en-US", name: "Microsoft Zira Desktop - English (United States)", lang: "en-US", … }

※自環境である、Windows10+Firefoxでのケース
※Chromeだと23個ほど出てきました。
※また、最初の2行はspeechSynthesis.getVoicesのみの実行ではリストが空だっためです

Comments

[cunwe]

ご回答いただきありがとうございます。お手数ですが、「ブラウザが対応してる言語が知りたい」という状態から教えていただいたコードを書くまでにattakei様が思考した過程を言語化していただくことは可能でしょうか...？

Answer 2

そのページ（https://wicg.github.io/speech-api/）はWeb Speech APIの仕様を記載しているだけであり、
どの言語をサポートしているかは、使っているプラットフォーム（ブラウザ）に依存します。

使っているブラウザがどの言語をサポートしているかは、
たとえばChromeならば、F12を押してDevToolsを開き、
コンソールに下記のコードを張り付けて実行することで、一覧を表示できます。

(参考：https://mseeeen.msen.jp/list-voices-with-web-speech-synthesis-api/）

function loadVoices() {
  console.log(window.speechSynthesis.getVoices().map(x => [x.name, x.lang].join("\t")).join("\r\n"));
};
loadVoices();
window.speechSynthesis.onvoiceschanged = function(e) { loadVoices(); }

表示された中に
「Microsoft Yunyang Online (Natural) - Chinese (Mainland) zh-CN」
のような行があれば、一応中国語がサポートされています。
（「zh-CN」が「中国語(簡体字)」を表します。前半はspeechエンジンの名称です。）

---

【コメントより】

今回はブラウザで実行しているためブラウザでどの言語をサポートされているかを確認するとのことでしたが、発展してWebアプリやネイティブアプリにこの音声合成機能を実装する際はどこでこういったことを確認するのでしょうか？

Webアプリとネイティブアプリで対応が異なる場合があります。
＜Webアプリについて＞
Webアプリとは、一般的にWebブラウザを利用したアプリケーションになりますので、そのWebブラウザに対して上記の操作をすれば同様に利用可能な言語を確認できます。
（各ブラウザで上記の https://mseeeen.msen.jp/list-voices-with-web-speech-synthesis-api/　の中段にあるcodepenの「Result」ボタンを押せば、利用可能な言語が表示されます）

モバイル上のアプリを視野に入れているならば、
最新のAndroidのモバイルChromeブラウザ、iOS系のSafariブラウザはいずれも中国語をサポートしているようです。

＜ネイティブアプリについて＞
（ここでは、Webブラウザコンポーネントを使用しない場合を想定します）
そのプラットフォームに用意されている音声合成API、もしくはサードパーティのライブラリのAPIを利用することが可能です。

参考：https://qiita.com/maKunugi/items/90cbefe97887470fb328

主要なものを列挙すると：

Android：TextToSpeech
-> AndroidのTextToSpeechで利用できる言語は、端末ごとに異なります。
その端末の「設定」->「システム」->「言語と入力」->「詳細設定」->「テキスト読み上げの出力」の言語設定から確認できます。
（実際には、ユーザーがアプリをインストール後、ユーザーに利用させたい言語データをダウンロードさせる形になります）

iOS：AVSpeechSynthesizer
->　開発時は、対応言語を、AVSpeechSynthesisVoiceクラスのspeechVoices()関数で取得できます。
端末側では、
設定->アクセシビリティ->VoiceOver->読み上げ->新しい言語を追加...
に記載されている言語一覧で利用可能かどうか判別できます。

Comments

[cunwe]

ご回答いただきありがとうございます。DevToolsでqnoir様に書いていただいたコードを実行しましたところ、一覧が表示されました。
ひとつ質問がございます。今回はブラウザで実行しているためブラウザでどの言語をサポートされているかを確認するとのことでしたが、発展してWebアプリやネイティブアプリにこの音声合成機能を実装する際はどこでこういったことを確認するのでしょうか？

[退会済みユーザー]

回答欄に追記しました。

[cunwe]

追記してくださりありがとうございます。大変勉強になりました。