我需要一个html音频元素来播放使用网络音频API的歌曲

时间:2014-08-05 19:49:31

标签: javascript html audio

刚开始学习网络音频api.i已经在Chrome.i中搜索了如何使用网络音频api加载和播放音频文件。除了点击事件之外,这里复制粘贴代码。我想播放一首歌曲一个onClick事件。但遗憾的是没有声音播放。 我对这些代码有一些疑问:

$我需要一个html音频元素才能使用网络音频api功能吗?

$代码有什么问题吗?如果有请帮我搞清楚。

我收到以下错误:

1。它表示XMLHttp无法加载m.mp3 .cross origin请求仅支持HTTP

2 未授权参考。错误:未能执行'发送'在XMLHttpRequest ..

以下代码:

<html>
<head>
<style>
#mydiv{
   width:30px;
   height:30px;
   border:1px solid black;
   border-radius:50%;
   background:blue;

}
</style>
</head>
<body>
<div id='mydiv' onClick='play();'></div>
<script>
var context = new webkitAudioContext();
var music; 

function loadSound() {
    var request = new XMLHttpRequest();
    request.open("GET", "m.mp3", true); 
    request.responseType = "arraybuffer"; 
    request.onload = function() {
     context.decodeAudioData(request.response,function(buffer){
        music = buffer;

    });}
    request.send();
}


function play() {
    source = context.createBufferSource(); /
    buffer = context.createBuffer(music, true); 
    source.buffer = buffer; 
    source.connect(context.destination); 
    source.start(0); 
}


window.onload=loadSound;
</script>
</body>
</html>

2 个答案:

答案 0 :(得分:1)

您需要一个音频元素,但不需要将其附加到DOM。

function play()
{
    (new Audio('m.mp3')).play();
}

请参阅此Fiddle作为示例。

请务必查看HTML5 audio and video guide on MDN.

答案 1 :(得分:1)

$我需要一个html音频元素来使用网络音频api功能吗?

答案:否

$代码是否有问题?如果有请帮我解决。

其中一个是});}在loadSound函数中

source = context.createBufferSource()

之后的播放功能中的随机前斜线

我收到以下错误:

<强> 1。它说XMLHttp无法加载m.mp3 .cross origin请求仅支持HTTP

2未授权参考。错误:无法在XMLHttpRequest上执行'send'..

您是在服务器还是桌面上运行它? 您需要在服务器上运行


尝试此操作,但请确保您使用同一服务器上的音频文件在服务器上运行它:

var audioBuffer;

var getSound = new XMLHttpRequest();

getSound.open("GET", "m.mp3", true);


getSound.onload = function() {
    audioContext.decodeAudioData(getSnare.response, function(buffer) {
        audioBuffer = buffer; // assign the buffer to a variable that can then be 'played'
    });


};
getSound.send()

function playSound() {

    var playSound = audioContext.createBufferSource();
    playSound.buffer = ourSound;
    playSound.connect(audioContext.destination);
    playSound.start(0)




}

window.addEventListener("mousedown", playSound);