I wanted to design an ionic app that listens to voice commands by following the tutorial here
But the app seems to recognize the voice commands over the microphone if tested on my computer using the var recognition = new webkitSpeechRecognition(); //To Computer command.But on seeing this post I replaced the command to
var recognition = new SpeechRecognition(); // To Device
But this dosen't seem to work on my android device.. Has anybody faced the same issue with SpeechRecognitionPlugin ? Please share your thoughts and reviews...Thanks
The timeout workaround isn't working for me. However, I did notice that I get almost 100% results if I speak IMMEDIATELY after the beep. I added a prompt to the user if no words are found.
Here is an example based on my approach:
var recording = false;
var spokenInput = '';
function startRecognition() {
if (!recording) {
recording = true;
spokenInput = '';
var recognition = new SpeechRecognition();
recognition.onresult = function(event) {
if (event.results.length > 0) {
spokenInput = event.results[0][0].transcript;
}
};
recognition.onend = function() {
recording = false;
if (spokenInput) {
alert(spokenInput);
} else {
alert('For best results, try speaking immediately after the beep!');
}
};
setTimeout(function() {
recognition.stop();
}, 6000); // Force stop after 6 seconds
recognition.start();
}
}
Finally able to crack it. The trick was to add the cordova media plugin.
The working code is as follows:
index.html
<!DOCTYPE html>
<html>
<head>
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
<link rel="stylesheet" type="text/css" href="css/index.css">
<title>Speech Recognition</title>
</head>
<body>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<form>
Click to speak <input type="button" value="speak" name="Download" id="speak" /> <br>
<input type="text" id="q" name="q" size=60>
</form>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</body>
</html>
app.js
$(document).ready(function() {
document.addEventListener("deviceready", onDeviceReady, false);
});
var recognition;
function onDeviceReady() {
$('#speak').click( function() {
recognition = new SpeechRecognition();
recognition.onresult = function(event) {
if (event.results.length > 0) {
console.log(event.results[0][0].transcript);
q.value = event.results[0][0].transcript;
}
};
recognition.start();
});
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With