ブラウザからの音声入力を認識してテキスト化する (Web Speech API)

  • 159
    いいね
  • 0
    コメント
この記事は最終更新日から1年以上が経過しています。

Chromeすごいわ。ブラウザだけでここまでできるとは。
こんな簡単なHTMLだけで音声認識→ テキスト化ができます。 日本語もOK。

speech.png

デモをこちらに起きました。
http://inouet.github.io/sample_html/001.speech_recognition.html

コード

<html>
<head>
  <meta charset="UTF-8" />
  <title>Web Speech API</title>
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script>
window.SpeechRecognition = window.SpeechRecognition || webkitSpeechRecognition;
var recognition = new webkitSpeechRecognition();
recognition.lang = 'ja';

// 録音終了時トリガー
recognition.addEventListener('result', function(event){
    var text = event.results.item(0).item(0).transcript;
    $("#result_text").val(text);
}, false);

// 録音開始
function record()
{
    recognition.start();
}
</script>
</head>

<body>

<textarea id="result_text" cols="100" rows="10">
</textarea>
<br />
<input type="button" onClick="record()" value="録音開始" />
</body>
</html>

※ ローカルに保存したHTMLをchromeで表示したらうごかず。WEBサーバー経由で表示しないとだめみたい。ハマった。

参考ページ