js 获取音乐的音频音铺

本文章记录一下js获取音乐的音频音铺信息的方法

var audio = new Audio("金坷垃三人组 - 获元钾.mp3");
var AudioContext = new (window.AudioContext || window.webkitAudioContext)();
var source = AudioContext.createMediaElementSource(audio)
var analyser = AudioContext.createAnalyser();
source.connect(analyser);
analyser.connect(AudioContext.destination)
audio.play()

首先需要通过Audio加载音乐的文件
后面就是通过AudioContext去加载音乐的信息

var output = new Uint8Array(1024);//这里可以设置获取数组的长度
(function createAudio(){
	analyser.getByteFrequencyData(output);
	console.log(output)
	requestAnimationFrame(createAudio)
})()

在音乐播放的同时通过不停的调用getByteFrequencyData可以获取音频的数组

这是使用获取的音频绘制的环形频谱

参考:
HTML5 Canvas 实现简易 绘制音乐环形频谱图