ブラウザで音声自動文字起こし(音声認識)を実装する方法

program

https://qiita.com/kolife/items/a0af7702eef05994fbfb
https://developer.mozilla.org/ja/docs/Web/API/Web_Speech_API
webkitSpeechRecognitionオブジェクトを利用する。(本来の仕様では SpeechRecognition オブジェクト)

<html>
<head>
<script>
document.addEventListener("DOMContentLoaded", () => {

    const content = document.getElementById('content');

    const speech = new webkitSpeechRecognition();
    speech.lang = 'ja-JP';
    speech.start();
    speech.onend = () => { speech.start(); };

    speech.onresult = function(e) {
         speech.stop();
         if(e.results[0].isFinal){
             var text =  e.results[0][0].transcript;
             content.insertAdjacentHTML("beforeend", `<p>${text}</p>`);
         }
     }

});
</script>
</head>
<body>
<div id="content"></div>
</body>
</html>