[英]Using Google Text-To-Speech in Javascript
I need to play Google text-to-speech in JavaScript.我需要在 JavaScript 中播放Google 文字转语音。
The idea is to use the web service:这个想法是使用网络服务:
http://translate.google.com/translate_tts?tl=en&q=This%20is%20just%20a%20test http://translate.google.com/translate_tts?tl=en&q=This%20is%20just%20a%20test
And play it on a certian action, eg a button click.并在特定动作上播放它,例如单击按钮。
But it seems that it is not like loading a normal wav/mp3 file:但是好像加载一个普通的 wav/mp3 文件不太一样:
<audio id="audiotag1" src="audio/example.wav" preload="auto"></audio>
<script type="text/javascript">
function play() {
document.getElementById('audiotag1').play();
}
</script>
How can I do this?我怎样才能做到这一点?
Another option now may be HTML5 text to speech , which is in Chrome 33+ and many others .现在的另一个选择可能是HTML5 文本到语音,它在 Chrome 33+ 和许多其他版本中。
Here is a sample:这是一个示例:
var msg = new SpeechSynthesisUtterance('Hello World');
window.speechSynthesis.speak(msg);
With this, perhaps you do not need to use a web service at all.有了这个,也许您根本不需要使用 Web 服务。
Here is the code snippet I found:这是我找到的代码片段:
var audio = new Audio();
audio.src ='http://translate.google.com/translate_tts?ie=utf-8&tl=en&q=Hello%20World.';
audio.play();
You can use the SpeechSynthesisUtterance
with a function like say :您可以将SpeechSynthesisUtterance
与类似say的函数一起使用:
function say(m) {
var msg = new SpeechSynthesisUtterance();
var voices = window.speechSynthesis.getVoices();
msg.voice = voices[10];
msg.voiceURI = "native";
msg.volume = 1;
msg.rate = 1;
msg.pitch = 0.8;
msg.text = m;
msg.lang = 'en-US';
speechSynthesis.speak(msg);
}
Then you only need to call say(msg)
when using it.那么你只需要在使用时调用say(msg)
。
Update : Look at Google's Developer Blog that is about Voice Driven Web Apps Introduction to the Web Speech API.更新:查看 Google 的开发者博客,其中介绍了语音驱动的 Web 应用程序对 Web Speech API 的介绍。
Very easy with responsive voice.响应式语音非常容易。 Just include the js and voila!只需包括 js 和瞧!
<script src='https://code.responsivevoice.org/responsivevoice.js'></script>
<input onclick="responsiveVoice.speak('This is the text you want to speak');" type='button' value='🔊 Play' />
Run this code it will take input as audio(microphone) and convert into the text than audio play.运行此代码,它将输入作为音频(麦克风)并转换为文本而不是音频播放。
<!doctype HTML>
<head>
<title>MY Echo</title>
<script src="http://code.responsivevoice.org/responsivevoice.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.1/css/font-awesome.min.css" />
<style type="text/css">
body {
font-family: verdana;
}
#result {
height: 100px;
border: 1px solid #ccc;
padding: 10px;
box-shadow: 0 0 10px 0 #bbb;
margin-bottom: 30px;
font-size: 14px;
line-height: 25px;
}
button {
font-size: 20px;
position: relative;
left: 50%;
}
</style>
Speech to text converter in JS var r = document.getElementById('result'); JS 中的语音到文本转换器 var r = document.getElementById('result');
function startConverting() {
if ('webkitSpeechRecognition' in window) {
var speechRecognizer = new webkitSpeechRecognition();
speechRecognizer.continuous = true;
speechRecognizer.interimResults = true;
speechRecognizer.lang = 'en-IN';
speechRecognizer.start();
var finalTranscripts = '';
speechRecognizer.onresult = function(event) {
var interimTranscripts = '';
for (var i = event.resultIndex; i < event.results.length; i++) {
var transcript = event.results[i][0].transcript;
transcript.replace("\n", "<br>");
if (event.results[i].isFinal) {
finalTranscripts += transcript;
var speechresult = finalTranscripts;
console.log(speechresult);
if (speechresult) {
responsiveVoice.speak(speechresult, "UK English Female", {
pitch: 1
}, {
rate: 1
});
}
} else {
interimTranscripts += transcript;
}
}
r.innerHTML = finalTranscripts + '<span style="color:#999">' + interimTranscripts + '</span>';
};
speechRecognizer.onerror = function(event) {};
} else {
r.innerHTML = 'Your browser is not supported. If google chrome, please upgrade!';
}
}
</script>
</body>
</html>
I don't know of Google voice, but using the javaScript speech SpeechSynthesisUtterance, you can add a click event to the element you are reference to.我不知道 Google 语音,但是使用 javaScript 语音 SpeechSynthesisUtterance,您可以向要引用的元素添加单击事件。 eg:例如:
const listenBtn = document.getElementById('myvoice'); listenBtn.addEventListener('click', (e) => { e.preventDefault(); const msg = new SpeechSynthesisUtterance( "Hello, hope my code is helpful" ); window.speechSynthesis.speak(msg); });
<button type="button" id='myvoice'>Listen to me</button>
The below JavaScript code sends "text" to be spoken/converted to mp3 audio to google cloud text-to-speech API and gets mp3 audio content as response back.下面的 JavaScript 代码将“文本”发送到 google cloud text-to-speech API 以进行口述/转换为 mp3 音频,并获取 mp3 音频内容作为响应。
var text-to-speech = function(state) {
const url = 'https://texttospeech.googleapis.com/v1beta1/text:synthesize?key=GOOGLE_API_KEY'
const data = {
'input':{
'text':'Android is a mobile operating system developed by Google, based on the Linux kernel and designed primarily for touchscreen mobile devices such as smartphones and tablets.'
},
'voice':{
'languageCode':'en-gb',
'name':'en-GB-Standard-A',
'ssmlGender':'FEMALE'
},
'audioConfig':{
'audioEncoding':'MP3'
}
};
const otherparam={
headers:{
"content-type":"application/json; charset=UTF-8"
},
body:JSON.stringify(data),
method:"POST"
};
fetch(url,otherparam)
.then(data=>{return data.json()})
.then(res=>{console.log(res.audioContent); })
.catch(error=>{console.log(error);state.onError(error)})
};
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.