这种方法将在Chrome / Safari中起作用：
+function(){ var ctx = new AudioContext() , url = 'https://cf-media.sndcdn.com/OfjMZo27DlvH.128.mp3?Policy=eyJTdGF0ZW1lbnQiOlt7IlJlc291cmNlIjoiKjovL2NmLW1lZGlhLnNuZGNkbi5jb20vT2ZqTVpvMjdEbHZILjEyOC5tcDMiLCJDb25kaXRpb24iOnsiRGF0ZUxlc3NUaGFuIjp7IkFXUzpFcG9jaFRpbWUiOjE1MTUwNDM5Njd9fX1dfQ__&Signature=FfmL2qUssAKs3Z7EPoYo0Yq8-SAg8rKLPs65EasXwuVkfsOB4joFqeCvVR2elpaG-lJaV4hXpXFiRCDWXNOYyAtO4Oz~sexiPwIoSk8-jWiVbGQRS8TMmUmj7TJzxemMOIj7ugWJKk6PHsrUdgqs9woDpHzxmkGCzk6sfqJEIsdeZJ4rWUFAh4iGWn9M6b0xfzTgndAJmytkNj9raCpWCBVmdr5u-r9nt~q5uF1easNSW9oaFilM4s1Hq2ei~VJye8zW9bzvrGm8idVdy-tiPeMWAKcE8J2VuaS1Ret6jRTRaHTDuiNgA5sZvgTzNpEpKtWI7UmAWI5TrqNVSlxpgQ__&Key-Pair-Id=APKAJAGZ7VMH2PFPW6UQ' , audio = new Audio(url) // 2048 sample buffer, 1 channel in, 1 channel out , processor = ctx.createscriptProcessor(2048, 1, 1) , meter = document.getElementById('meter') , source audio.crossOrigin = 'anonymous' audio.addEventListener('canplaythrough', function(){ source = ctx.createMediaElementSource(audio) source.connect(processor) source.connect(ctx.destination) processor.connect(ctx.destination) audio.play() }, false); // loop through PCM data and calculate average // volume for a given 2048 sample buffer processor.onaudioprocess = function(evt){ var input = evt.inputBuffer.getChannelData(0) , len = input.length , total = i = 0 , rms while ( i < len ) total += Math.abs( input[i++] ) rms = Math.sqrt( total / len ) meter.style.width = ( rms * 100 ) + '%' }}()#meter { width: 0%; height: 15px; margin: 2px 0; background: green; -webkit-transition: width .05s;}<div id="meter"></div>重要的事情发生在这里：
processor.onaudioprocess = function(evt){ var input = evt.inputBuffer.getChannelData(0) , len = input.length , total = i = 0 , rms while ( i < len ) total += Math.abs( input[i++] ) rms = Math.sqrt( total / len ) meter.style.width = ( rms * 100 ) + '%' }基本上，您每隔2048个样本就获取一次原始PCM数据（值从-1到1），然后遍历它们，从而计算给定时间段内的平均信号电平。
然后，您可以使用该值制作动画。
编辑： 更新为使用RMS，正如Jason指出的那样，RMS是一种更有意义的度量。
