javascript 如何播放从服务器下载的mp3文件的声音-我不熟悉流数据

7eumitmz  于 2023-01-24  发布在  Java
关注(0)|答案(1)|浏览(192)

我的服务器上有一个名为test.mp3的文件-我可以播放它
我正尝试使用xmlhttprequestget下载它,然后将响应分配给音频播放器。
我试过了

servpl.onclick = e =>{
const xhr = new XMLHttpRequest();

xhr.open('GET', 'sounds/test.mp3');

// Send the request over the network
xhr.send();
xhr.onload = function() {
if (xhr.status != 200) { // analyze HTTP status of the response
    alert(`Error ${xhr.status}: ${xhr.statusText}`); // e.g. 404: Not Found
} else { // show the result
    alert(`Done, got ${xhr.response.length} bytes`); // response is the server response
    //    recordedAudio.autoplay=true;
    recordedAudio.src=xhr.response;
    recordedAudio.play();

   document.getElementById("display").innerHTML+=" after play sound";  
 
    }
};
document.getElementById("display").innerHTML+=" Server Play clicked";

}

ufj5ltwl

ufj5ltwl1#

您可以使用audio标记播放该mp3文件,如下所示

<audio autoplay>
  <source src="sounds/test.mp3" type="audio/mpeg">
  Your browser does not support the audio element.
</audio>

还可以使用JS创建audio标记

var audio = document.createElement('audio');
audio.src = 'sounds/test.mp3';
audio.type = 'audio/mpeg';
document.body.appendChild(audio);

在这种情况下,您需要监视readyState以查看音频是否已加载并准备好播放。另一个选项是为oncanplay事件添加处理程序。一旦加载了音频,您就可以执行audio.play();以开始播放它。
请注意,主流浏览器只允许您在button.click处理程序或其他由用户触发的事件处理程序中执行audio.play()命令。这是一项安全措施,旨在防止网站在后台自动播放媒体而不允许用户查看/控制它们。
如果有帮助请告诉我。

相关问题