Question

以低网络速度进行测试，为了正确使用来自JavaScript的Google tts API，情况是有时它会读取而有时则不会，它可能会读取非常短的文本，如“hi”，如何确保请求音频有负载。

    <!DOCTYPE html>
    <html>
     <head>
       <meta charset="UTF-8">
       <title></title>
       <script>
        function playit() {
                var audio = new Audio();
                audio.src = 'http://translate.google.com/translate_tts?ie=UTF-8&tl=en&q=Okay i can read but not alwayes';
                //function(){testbeforplaying;}
                audio.play();
        }
      </script>
     </head>
     <body>
       <input type="button" value="say" onclick="playit()"/>
     </body>
    </html>

Answer 1

加载音频（或视频或图像）是一种异步操作，因此您需要聆听浏览器的回调机制，以了解文件何时可以使用。

<强>更新

在混音中添加type，并演示：

<强> Fiddle

如果是音频（和视频），您可以收听canplay事件：

function playit() {
    var audio = new Audio();
    audio.addEventListener('canplay', function() {
        this.play();
    }, false);
    audio.type = 'audio/mpeg';
    audio.src = '...';
}

您也可以使用canplaythrough代替canplay。

可选择执行此操作：

function playit() {
    var audio = new Audio();
    audio.preload = 'auto';
    audio.autoplay = true;
    audio.type = 'audio/mpeg';
    audio.src = '...';
}

似乎有an issue with Chrome - 它取消了平局：

enter image description here

如何确保来自Google tts的传入语音已完全加载？

1 个答案: