Demo of Web Speech API Speech Synthesis interface (Text to Speech)

Here are some very simple demos based on the Web Speech API SpeechSynthesis Interface

As of 2013-06-05, this is an experimental feature in the Google Chrome Canary browser (not the regular release version).

To use it you must go to the chrome://flags settings page, enable experimental WebKit features and restart your browser.

This interface is under active development... there are some bugs and not all parts of the API are implemented... caveat emptor

Open up the Javascript console in Google Chrome (under Developer Tools) to see the output from some of these demos

 
 

Demo 1: Minimal Example

Create a new SpeechSynthesisUtterance and speak it...

    var u = new SpeechSynthesisUtterance('You have reached your destination');
    speechSynthesis.speak(u);
  

Demo 2: Example with options

Create a new SpeechSynthesisUtterance and speak it...

     var u = new SpeechSynthesisUtterance();
     u.text = 'You have reached your destination';
     u.lang = 'en-US';
     u.rate = 1.2;
     u.onend = function(event) { console.log('Speech complete'); }
     speechSynthesis.speak(u);
  

Demo 3: More options

Decreased rate of speech and volume, increased pitch... language and voiceURI do not seem to have any effect as yet

      var u = new SpeechSynthesisUtterance();
      u.text = 'The quick brown fox jumps over the lazy dog';
      u.lang = 'en-US';
      u.rate = 0.75;
      u.pitch = 2.0;
      u.volume = 0.5;
      speechSynthesis.speak(u);
  

Demo 4: Get Voices

Fetch a list of the available voices - on my system (Mac OS X), these correspond to the MacOSX 'English (United States) - Novelty' list

No doubt this will be expanded as the software matures - I can't tell if the browser is relying on the system voices or not

The voiceURI attribute of SpeechSynthesisUtterance does not seem to be implemented as yet

      var voices = speechSynthesis.getVoices();
      for(var i = 0; i < voices.length; i++ ) {
        console.log("Voice " + i.toString() + ' ' + voices[i].name + ' ' + voices[i].uri);
      }
  

 
 

These demos were written by Rob Jones - Craic Computing LLC, based on the API document, and are made freely available under the MIT License

I am not involved in the development of the API or browser software in any way.