57

我需要在 JavaScript中播放Google 文字转语音。
这个想法是使用网络服务:

http://translate.google.com/translate_tts?tl=en&q=This%20is%20just%20a%20test

并在某些动作上播放它,例如单击按钮。

但它似乎不像加载普通的 wav/mp3 文件:

<audio id="audiotag1" src="audio/example.wav" preload="auto"></audio>

<script type="text/javascript">
    function play() {
        document.getElementById('audiotag1').play();
    }
</script>

我怎样才能做到这一点?

4

7 回答 7

159

现在的另一个选择可能是HTML5 文本到语音,它在 Chrome 33+ 和许多其他版本中。

这是一个示例:

var msg = new SpeechSynthesisUtterance('Hello World');
window.speechSynthesis.speak(msg);

有了这个,也许您根本不需要使用 Web 服务。

于 2014-03-06T19:24:36.537 回答
27

这是我找到的代码片段:

var audio = new Audio();
audio.src ='http://translate.google.com/translate_tts?ie=utf-8&tl=en&q=Hello%20World.';
audio.play();
于 2013-03-27T06:58:01.340 回答
20

您可以将 theSpeechSynthesisUtterancesay之类的函数一起使用:

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);
}

然后你只需要say(msg)在使用时调用它。

更新:查看 Google 的开发人员博客,该博客是关于 Voice Driven Web Apps Introduction to the Web Speech API。

于 2018-03-02T19:10:06.873 回答
15

响应式语音非常容易。只需包括 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' />
于 2018-10-16T22:06:51.663 回答
4

运行此代码,它将输入作为音频(麦克风)并转换为文本而不是音频播放。

<!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>

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>
于 2016-09-06T09:27:21.537 回答
4

我不知道 Google 语音,但使用 javaScript 语音 SpeechSynthesisUtterance,您可以将点击事件添加到您引用的元素。例如:

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>

于 2020-09-09T23:28:35.353 回答
3

下面的 JavaScript 代码将要朗读/转换为 mp3 音频的“文本”发送到 google cloud text-to-speech API,并获取 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)})
  };
于 2020-12-30T04:38:45.517 回答