I just launched a new course on ES6! Use the code WESBOS for $10 off.

Strengthen your core JavaScript skills and master all that ES6 has to offer. Start Now →

Easy JavaScript text-to-speech with google translate

Hey everyone – a little trick here today with the HTML5 audio element and the Google translate API.

Turns out you can use this query string to dynamically create an audio element. We can then encode our text, pop that url into an audio element and play it with a few lines of JavaScript.

It’s worth noting that this isn’t the real way to do text to speech, but its a very simple, cross browser solution that can help you out in a pinch.

Here is a quick video detailing how it works – I’d love to see what you all do with this.

This entry was posted in HTML5, JavaScript, Other. Bookmark the permalink.

4 Responses to Easy JavaScript text-to-speech with google translate

  1. James Harris says:

    Wes, when I try this I get a 404 from Google. Others are saying that Google blocks requests for these files when they include referrer-headers. (Example: http://stackoverflow.com/questions/30929663/hide-referrer-header-in-api-request) How would one get around this?

  2. Deepak says:

    Hey Wes, First of all thanks for this tutorial this is what i was looking for but i created a new HTML file and copied the code as it is, but mine is not working. can you tell me why? am i missing something?

  3. Bob says:

    Nice video, but would be nice to have added at least the code as text or a link 😉

  4. vishnu says:

    I tried with the same code as described in the video. But it is not working at all.

Leave a Reply

Your email address will not be published. Required fields are marked *