要用到的属性事件和方法
audioContext:音频上下文
audio:封装的比较表层
底层的控制权限获取不到
只能播放完整的音频文件
属性
audioContext用于比较复杂的播放器,也可以播放媒体流
currentTime:只能用于播放完整的音频文件使用
destination:输出口(目标节点) -》AudioNode
state:当前播放的状态
事件
onstatechange:当状态发生改变的时候触发
方法
createBufferSource():创建bufferSource->AudioBufferSourceNode
MediaStreamAudioSourceNode
suspend():继续
resume():暂停
AudioPlayer.js文件
(function() {
functionAudioPlayer() {
// this.loadAudioSourceNode();
}
// navigator.mediaDevices.getUserMedia({audio:true}).then(function (stream) {
// var audioContext = new AudioContext()
// });
AudioPlayer.prototype.loadAudioSourceNode=function(url) {
varaduioContext =newAudioContext();
//资源节点 通过资源节点进行播放
varsourceNode = aduioContext.createBufferSource();
this.loadAudioFile(url).then(function(arraybuffer) {
//转化成arrayBuffer类型的数据
aduioContext.decodeAudioData(arraybuffer,function(audioBuffer) {
//设置输入元的数据
sourceNode.buffer= audioBuffer;
//设置输出源的端口
sourceNode.connect(aduioContext.destination);
sourceNode.start();
});
});
};
AudioPlayer.prototype.loadAudioFile=function(url) {
return newPromise(function(res) {
varrequest =newXMLHttpRequest();
//audioContext在创建资源库的时候 需要一个AudioBuffer类型的数据
//AudioBuffer 可以通过decodeAudioData获得
//decodeAudioData 需要ArrayBuffer类型的数据
//在加载音频数据的时候 就需要指定 返回的格式是bufferArray类型
request.responseType="arraybuffer";//设置成bufferArray类型,想获得音频文件
request.open("GET",url);
request.onload=function() {
res(request.response);
};
request.send();
})
};
window.AudioPlayer=AudioPlayer;
})();
app.js文件
(function() {
varplayer =newAudioPlayer();
player.loadAudioSourceNode("味道.mp3");
})();
网友评论