Converting text to speech using HTML5 audio

If we were to build a web-based navigation applications today, most of the components would already be available. There are Google maps or open street map components to display maps, as well as API services that provide driving directions.

But what about voice-based navigation guidance? Wouldn't that require another API service that converts text to speech?

Thanks to HTML5 audio and Emscripten (a C to JavaScript compiler), we can now use a free text-to-speech engine called espeak that works fully in the browser.

In this example we're going to use espeak to generate text entered by the user on a simple page. Most of the work will consist of preparations—we will need to set up espeak.js.

Getting ready

We need ...

Get HTML5 Data and Services Cookbook now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.