Firefox and Speech Synthesis API

Question

I'm creating HTML5 Speech Synthesis application like below link.

http://updates.html5rocks.com/2014/01/Web-apps-that-talk---Introduction-to-the-Speech-Synthesis-API

Windows7 and Android Chrome33beta or Mac's safari works fine.

but Windows7-Firefox 27 seems support Speech-Synthesis-API,but not work because return empty voice list.

Is there any solution?

There’s an `about:config` flag called `media.webspeech.synth.enabled` that enables `speechSynthesis` in Firefox. Problem stays, `speechSynthesis.getVoices().length===0`. — dakab, Jul 07 '15 at 14:22

Yukulélé · Answer 1 · 2017-01-05T13:36:35.670

4

Check if Speech Synthesis API is supported your browser
http://caniuse.com/#feat=speech-synthesis

You can check it with modernizr
http://v3.modernizr.com/download/#-speechsynthesis

If browser not support it, you can use meSpek.js
http://www.masswerk.at/mespeak/

edited Jan 05 '17 at 13:36

answered Jan 17 '15 at 14:16

Yukulélé

15,644
10
70
94

My Firefox 50 for Linux says I have 0 voices (Fedora 23). Should we need to download by hand each voice? Is there a standard repository for this? Chrome 55 comes already with 19. – Luis A. Florit Dec 24 '16 at 18:18

PhistucK · Answer 2 · 2014-10-15T11:38:17.677

1

Unfortunately, it looks like only Firefox OS (and perhaps also, Firefox for Android, I have not checked) bundles and supports a speech synthesis library.

There is an open bug regarding desktop support.

edited Oct 15 '14 at 11:38

answered Mar 29 '14 at 15:44

PhistucK

2,466
1
26
28

uncleoptimus · Answer 3 · 2016-08-01T02:31:01.090

As of release 44, the Speech Synthesis half of the api is available on Firefox Desktop.

But weirdly still requires that the flag be set. Under "Browser Compatibility":

Can be enabled via the media.webspeech.synth.enabled and media.webspeech.recognition.enable flags in about:config. Note that currently only the speech synthesis part is available in Firefox Desktop — the speech recognition part will be available soon, once the required internal permissions are sorted out.

I wonder why. MDN has even gone to the trouble of whipping up some nice working examples, why not have the functionality enabled be default?

score 0 · Answer 4 · answered Sep 15 '16 at 06:18

If you just want to add a button to your webpage to read the page out loud, add this code to your website:

<script src='https://code.responsivevoice.org/responsivevoice.js'></script>
<script type="text/javascript">
    <!-- //
    var speechpause=0;
    function toggleSpeech(){
      if(speechpause!=1){
        responsiveVoice.pause();
        speechpause=1;
      }else{
        responsiveVoice.resume();
        speechpause=0;
      }
    }
    //-->
</script>
<div style="float:right">
      <input onclick="responsiveVoice.speak($('#some_div_with_content').text(), 'Deutsch Female', {pitch: .7});" type="button" value=" Play" />
      <input onclick="toggleSpeech()" type="button" value="||" />
</div>

This uses jquery to get the text of the content, but that could be easily changed.

Firefox and Speech Synthesis API

4 Answers4