Here is for those who are desperate to play Google TTS as audio in HTML: let me save you a couple of hours of time and tell you how to do it .
Let's say we have this link: https://translate.google.com/translate_tts?ie=UTF-8&client=tw-ob&tl=en&q=I+love+coffee
If you try to play this audio at the specified link and use <audio> , <iframe> using third-party libraries or play it using Javascript ...
var audio = new Audio('https://translate.google.com/translate_tts...'); audio.play();
... then you will soon find that none of the above methods work, as 404 error is thrown .
Decision
Apparently, the only possible way to play this universal TTS sound is to use a <embed> enclosed in a custom <iframe> and assign a unique version number to the link (this is important because browser caching does not allow the sound to play for some reason).
Here is the solution for our example: (if you have iframe # ttsiframe)
function playTTS(lang,sentence) { //get the iframe var iFrame = document.getElementById('ttsiframe'); //remove its sandbox property iFrame.removeAttribute('sandbox'); //this is your reference variable for the iframe body and head tag var iFrameBody; //get the body if (iFrame.contentDocument) { // FF iFrameBody = iFrame.contentDocument.getElementsByTagName('body')[0]; iFrameHead = iFrame.contentDocument.getElementsByTagName('head')[0]; } else if (iFrame.contentWindow) { // IE iFrameBody = iFrame.contentWindow.document.getElementsByTagName('body')[0]; iFrameHead = iFrame.contentWindow.document.getElementsByTagName('head')[0]; } else { iFrameBody = iFrame.contentDocument.body; iFrameHead = iFrame.contentDocument.head; } //generate link to Google Translate TTS using arguments (pay attention to random version number at the end) var link = 'https://translate.google.com/translate_tts?ie=UTF-8&client=tw-ob&tl=' + lang + '&q=' + sentence.replace(/ /g,'+').replace(/[.]/g,'') + '&rd=' + getRandomInt(0,50000000); //add embed element with our link iFrameBody.innerHTML = '<embed src="' + link + '" id="TTS">'; //isolate iframe iFrame.setAttribute('sandbox',''); }
source share