ども、カロージです。
数年前に流行ってた?(と認識している)「SpeechRecognition」が
結構おもしろかったので、以下にコードと手順を共有させて頂きます。
〇出来ること
数行JavaScriptを書くことで音声認識をして文字起こしができます。
〇環境
Windows 11
〇必要なもの
Chrome + テキストエディタ
〇手順
・画面の下の方にあるコードをテキストエディタに張り付け、任意の名前で拡張子HTMLで保存して下さい。
・Windowsの場合、作成したHTMLファイルをダブルクリックすると拡張子に紐付いたブラウザが開きます。(私の場合は、Chromeが開きます)
・表示された画面にある「音声認識開始」ボタンをクリックします。
・マイクの使用の許可を求められるので「許可」ボタンをクリックします。
・何か喋ると、音声認識をして認識した文字を画面に表示します。
〇サンプル
このページにも組み込んでみたので、試しに「音声認識開始」ボタンを押して何か喋ってみて下さい。
〇コード
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>SpeechRecognition</title> <script> window.SpeechRecognition = window.SpeechRecognition || webkitSpeechRecognition; var recognition = new webkitSpeechRecognition(); recognition.lang = 'ja'; recognition.interimResults = true; recognition.continuous = true; recognition.onsoundstart = function(){ document.getElementById('status').innerHTML = "[認識中]"; }; recognition.onsoundend = function(){ document.getElementById('status').innerHTML = "[停止]"; }; recognition.onresult = function(event){ var results = event.results; for (var i = event.resultIndex; i < results.length; i++){ document.getElementById('result').innerHTML = results[i][0].transcript; }} </script> </head> <body> <div id="result"></div> <div id="status"></div> <br /> <button onClick="recognition.start();">音声認識開始</button> <button onClick="recognition.stop();">音声認識終了</button> </body> </html> |
以前、何かの勉強会で、ちょまどさん自身が、活舌が悪く「さ」行が苦手で、
スマートスピーカーで活舌チェックが出来るスキルを作成された。と仰っていたことを思い出しました。
(この機能でも、チェックが出来そうですっ!)
また、何か面白いモノみかけたら共有させて頂きます。 でわ