0

I have a web application that makes use of the HTML5 speech synthesis API and it works - but only with the native voice. Here's my code:

var msg = new SpeechSynthesisUtterance();
var voices;

window.speechSynthesis.onvoiceschanged = function() {
    voices = window.speechSynthesis.getVoices();
};

$("#btnRead").click(function() {
        speak();
});

function speak(){
    msg = new SpeechSynthesisUtterance();
    msg.rate = 0.8;
    msg.text = $("#contentView").html();
    msg.voice = voices[10];
    msg.lang = 'en-GB';
    window.speechSynthesis.speak(msg);
}

voices[10] is the only voice that works and when I log it to the console I can see that it's the native voice - which seems to suggest that the other voices aren't being loaded properly, but they still appear in the voices array when it's logged to the console as you can see here:

Screenshot of console

Anyone have any ideas? I'm sure I'm probably missing something relatively simple but I've been wrestling with this for a bit now! I'm using Google Chrome version 42.0.2311.90 which should support the speech synthesis API as far as I can tell.

Sean Morris
  • 135
  • 2
  • 10

1 Answers1

1

Just started playing with speechSynthesis so did not spend so much time on it. I stumbled on your question and I believe the answer is that the voice you select does not support the language you give it and you get a fallback.

If you read the docs and check how you select a voice it works (at least at my pc) https://developers.google.com/web/updates/2014/01/Web-apps-that-talk-Introduction-to-the-Speech-Synthesis-API?hl=en

var msg = new SpeechSynthesisUtterance('Awesome!');
msg.voice = speechSynthesis.getVoices().filter(function(voice) { 
      return voice.name == 'Google UK English Male'; 
})[0];

// now say it like you mean it:
speechSynthesis.speak(msg);

Hope this helps you or others searching for it.

Jørgen
  • 2,157
  • 1
  • 23
  • 24