Speech to text has been around for a long time. There are many services available which can do the speech to text with amazing accuracy. Did you know that your chrome browser too can do the speech to text using web speech api? Yes you heard it right. Read below to find out more

Web Speech api

Web speech api is a specification from w3c. It specifies the standard javascript api enable web developers to incorporate speech recognition and synthesis into their web pages. So if any browser implements this standard, then the methods to access the api will remain same. Chrome has implemented the standard in its browser and you can use them with chrome version 25 and above.

You can open the fiddle above, run the script and allow the access to your microphone. It will convert the speech to text.

The api to convert speech to text is fairly simple. You need to use webkitSpeechRecognition api available in the browser.

In order to start the speech recognition,

var recognition = new webkitSpeechRecognition();
recognition.start();

In order to stop it, call the stop function

recognition.stop()

Similarly, to get the text response from the speech, use the property onresult.

recognition.onresult = (event)=>{
	// handle event here
}

Here is the complete code to convert speech to text which have been used in jsfiddle link as well

var recognition = new webkitSpeechRecognition();
recognition.continuous = true;
recognition.interimResults = true;
var finalResult = ''

function start() {
  recognition.start()
}

function stop() {
  recognition.stop()
}

recognition.onresult = (event) => {
  var interimResult = ''

  for (var i = event.resultIndex; i < event.results.length; ++i) {
    if (event.results[i].isFinal) {
      finalResult += event.results[i][0].transcript;
    } else {
      interimResult += event.results[i][0].transcript;
    }
  }

  document.querySelector('textarea').innerText = finalResult + interimResult
  // event contains the result
  console.log("speech recognition is", event)
}