概要
音声合成と音声認識の両技術を活用してChromeブラウザを相手に会話可能なページを作成します。
継続利用可能な役立つページにしたいので会話のテーマは「英語における形容詞の語順」の理解とします。
TL;DR
- デモサイトはこちら (Chromeブラウザでアクセスしてね！)
- ソースコードはこちら
- 利用ＡＰＩはこちら
音声認識について
ＰＣのマイクに向かって喋った言葉を理解してもらう。
Web Speech API インターフェイスの「SpeechRecognitionＸＸＸ」を利用します。
今回利用したのは以下のとおり。
| インターフェース | 説明 |
|---|---|
| SpeechRecognition | 音声認識の親玉（認識言語や認識結果の候補数の設定など） |
| SpeechGrammarList | 認識させたい単語の列挙 |
speech.js
const SpRec = SpeechRecognition
const SpGrm = SpeechGrammarList
const words = QuestionGenerator.getWords() // 認識させたい単語を全部配列で取得
const grammar = '#JSGF V1.0; grammar words; public <words> = ' + words.join(' | ') + ' ;'
// 認識の準備として各種設定
const speechRecognitionList = new SpGrm()
speechRecognitionList.addFromString(grammar, 1)
SpRec.grammars = speechRecognitionList
SpRec.continuous = false
SpRec.lang = 'en-US'
SpRec.interimResults = false
SpRec.maxAlternatives = 3
SpRec.onstart = function (event) {
// 認識開始
}
SpRec.onresult = function (event) {
// 認識結果取得
}
SpRec.onend = function (event) {
// 認識終了
}
音声合成について
ＰＣのスピーカーから言葉を発してもらう。
Web Speech API インターフェイスの「SpeechSynthesisＸＸＸ」を利用します。
今回利用したのは以下のとおり。
| インターフェース | 説明 |
|---|---|
| SpeechSynthesis | デバイス上の合成音声に関する情報を検索したり、speech の開始、一時停止、またはその他のコマンドを使用したりする際に使われます |
| SpeechSynthesisUtterance | 発話内容（言語、音声の高低、音量を含む） |
| SpeechSynthesisVoice | システムがサポートする音声 |
speech.js
// システムがサポートする音声のリストを取得
const voiceList = window.speechSynthesis.getVoices()
// 音声リストの1番目を利用して喋ってもらう
const msg = 'Hello!'
var utterThis = new SpeechSynthesisUtterance(msg)
utterThis.voice = voiceList[0]
window.speechSynthesis.speak(utterThis)
参考にさせていただいたサイト
- 音声合成や音声認識を説明するデモ
まとめ
音声合成、音声認識共にAPIの通りに引数を渡すだけで自動的しゃべったり、認識を行なってくれるので簡単に利用することが出来ます。
文頭が「a」の場合、「あ」って発音してもまず認識してもらえませんでした。
同じ「限定詞（determiner）」の「The」「ざ、じ」は大丈夫なんですけどねぇ。。。
ちなみに「えいー」って発音すると認識してくれるのですが、それは負けな気がするので「限定詞（determiner）」の部分は認識対象から外しました。
結果、キーボード操作なしの発話だけで操作可能です。
ぜひお試し下さい。
最後まで読んでくれた方ありがとうございます。