Javascript Web Audio API AnalyserNode не работает

Код должен передавать любой URL-адрес и обеспечивать визуализацию звука. К сожалению, визуализатор не работает. Визуализация основана на данных из AnalyzerNode, который всегда возвращает пустые данные. Почему в этом коде не работает AnalyserNode? Число_объектов на исходном узле увеличивается после I .connect(), но числоOfInputs в AnalyserNode не изменяется.Javascript Web Audio API AnalyserNode не работает

<html> 
    <head> 
     <script> 
      var context; 
      var source; 
      var analyser; 
      var canvas; 
      var canvasContext; 

      window.addEventListener('load', init, false); 
      function init() { 
       try { 
        // Fix up for prefixing 
        window.AudioContext = window.AudioContext || window.webkitAudioContext; 

        window.requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame || 
          window.webkitRequestAnimationFrame || window.msRequestAnimationFrame; 

        context = new AudioContext(); 
        analyser = context.createAnalyser(); 
        canvas = document.getElementById("analyser"); 
        canvasContext = canvas.getContext('2d'); 
       } 
       catch(e) { 
        alert(e); 
        alert('Web Audio API is not supported in this browser'); 
       } 
      } 

      function streamSound(url) { 
       var audio = new Audio(); 
       audio.src = url; 
       audio.controls = true; 
       audio.autoplay = true; 
       source = context.createMediaElementSource(audio); 
       source.connect(analyser); 
       analyser.connect(context.destination); 
       document.body.appendChild(document.createElement('br')); 
       document.body.appendChild(audio); 
       render(); 
      } 

      function render(){ 
       window.requestAnimationFrame(render); 
       //Get the Sound data 
       var freqByteData = new Uint8Array(analyser.frequencyBinCount); 
       analyser.getByteFrequencyData(freqByteData); 
       //we Clear the Canvas 
       canvasContext.clearRect(0, 0, canvas.width, canvas.height); 
       //draw visualization 
       for(var i=0;i<analyser.frequencyBinCount;i++){ 
        canvasContext.fillRect(i*2,canvas.height,1,-freqByteData[i]); 
        //Data seems to always be zero 
        if(freqByteData[i] != 0) { 
         alert(freqByteData[i]); 
        } 
       } 
      } 
     </script> 
    </head> 
    <body> 
     <button onclick="streamSound(document.getElementById('url').value)"> Stream sound</button> 
     <input id="url" size='77' value="Enter a URL to Stream"> 
     <br /> 
     <canvas id="analyser" width="600" height="200"></canvas> 
    </body> 
</html>

источник

2013-05-17 user2392226

Вы должны настроить приемник событий для canplay события Аудиокампании и только настройки MediaElementSource и подключить его после этого пожара событий.

Это также won't work in Safari due to a bug in their implementation. AFAIK Chrome - единственный браузер, который правильно поддерживает API веб-аудио.

источник

2013-05-17 04:05:14 idbehold

Большое спасибо. Починил это! – user2392226

Javascript Web Audio API AnalyserNode не работает

ответ

Смежные вопросы