Web speech api closes after some seconds

Question

I'm using web speech api

https://www.google.com/intl/en/chrome/demos/speech.html

but mic automatically closes after some seconds but i have to close mix only when the user clicks on close buttons.

Any solution to resolve this issue. Thanks

Answer 1

You should mark the recognition service as continuous and maybe start the recorder again if it stops after the timeout when there is no activity.

 <button onclick='toggleRecording()'>Toggle recorder</button>
 <div id='results'></div>
 <script>
    window.SpeechRecognition = window.SpeechRecognition ||
    window.webkitSpeechRecognition;

    let recognition = new window.SpeechRecognition()
    let recording = false;
    let results = null;

    recognition.continuous = true;

    function toggleRecording() {
        if(recording) {
            recognition.onend = null;
            recognition.stop();
            recording = false;

            // Printing all results we got so far.
            if(results) {
                let resultsDiv = document.getElementById('results')
                for(let i=0; i<results.length; ++i)
                    resultsDiv.innerHTML = resultsDiv.innerHTML + results.item(i)[0].transcript
            }
        } else {
            recognition.onend = onEnd;
            recognition.start();
            recording = true;
        }
    }

    function onEnd() {
        console.log('Speech recognition has stopped. Starting again ...');
        recognition.start();
    }


    function onSpeak(e) {
        results = e.results;
        console.log(e.results[e.results.length-1][0].transcript);
    }

    recognition.addEventListener('result', onSpeak);

</script>