5

I am trying to access the audio from chrome browser using javascript code below, but when I click the the button the recognition.onresult event is not firing in chrome browser, however when I access the online webpage that contains live demo of speech to text, its working fine in chrome browser please help.

<script type="text/javascript">
  var recognition = new SpeechRecognition();
  recognition.onresult = function(event)
  {
    if (event.results.length > 0) 
    {
       alert("Working");
    }
  }
</script>

<form>
  <input type="button" value="Click to Speak"onclick="recognition.start()">
</form>
Faisal Sajjad
  • 239
  • 2
  • 4
  • 13
  • What errors do you see in the [JavaScript console](http://webmasters.stackexchange.com/questions/8525/how-to-open-the-javascript-console-in-different-browsers)? Also, are you using an external library? At the moment, the current version of Chrome requires a `webkit` prefix (`webkitSpeechRecognition()`); there's no unprefixed version. – Paul Roub Dec 04 '15 at 21:08
  • I replaced ( SpeechRecognition() ); with prefix ( webkitSpeechRecognition() ); the error it give me is "not-allowed" – Faisal Sajjad Dec 04 '15 at 21:22
  • Related http://stackoverflow.com/questions/14318319/webrtc-browser-doesnt-ask-for-mic-access-permission-for-local-html-file?lq=1 – Nikolay Shmyrev Dec 07 '15 at 09:53

1 Answers1

5

I just tried on my computer and it works:

$(function () {
  try {
    var recognition = new webkitSpeechRecognition();
  } catch (e) {
    var recognition = Object;
  }
  recognition.continuous = true;
  recognition.interimResults = true;
  recognition.onresult = function (event) {
    var txtRec = '';
    for (var i = event.resultIndex; i < event.results.length; ++i) {
      txtRec += event.results[i][0].transcript;
    }
    $('#txtArea').val(txtRec);
  };
  $('#startRecognition').click(function () {
    $('#txtArea').focus();
    recognition.start();
  });
  $('#stopRecognition').click(function () {
    recognition.stop();
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button id="startRecognition">Start Recognition</button>
<button id="stopRecognition">Stop Recognition</button>
<textarea id="txtArea"></textarea>
gaetanoM
  • 41,594
  • 6
  • 42
  • 61