Search code examples
javascripthtmlspeech-recognitionspeech-synthesis

HTML5 Web Speech API not working locally

I am trying to make this code work and don't know why is it not working locally. I tried the same on CodePen.io and it works.

<html>
<head>
    <title>Voice API</title>

</head>

<body>
    <button onClick="func()">Click Me</button>
    <script>
        function func()
        {
            alert('Hello');
            var recognition = new webkitSpeechRecognition();
            recognition.continuous = true;
            recognition.interimResults = true;
            recognition.onresult = function(event) 
            { 
                alert(event.results[0][0].transcript); 
            }
            recognition.start();
        }
    </script>
</body>

Any suggestions?

Solution

  • You could try adding the following snippet to see what error is being generated.

    recognition.onerror = function(event) {
    console.log(event.error);
};

    Chances are its spitting out a 'not-allowed' which generally means that the user agent is not allowing any speech input to occur for reasons of security, privacy or user preference (as you're running it locally through a file:// )

    Have you tried serving the page under a local Web Server such as (IIS or Node) ?