2017-06-16 1 views
0

Je tente de visualiser les enregistrements d'appels de l'API twilio à l'aide d'un analyseur audio web html5, mais chaque fois que j'attache mon analyseur (visualiseur), il coupe le son.L'audio Web est mis en sourdine lors de la connexion d'un mediaElementSource

ici est le code correspondant:

initScope = function() { 
     context = new window.AudioContext() 
     canvas = document.querySelector('.visualizer') 
     scope = new Oscilloscope(canvas, options) 
     source = context.createMediaElementSource($oscilloscope[0]) //MH TODO: sound gets cut here 
    } 

est l'endroit où l'analyseur est mis en place, où [Oscilloscope] [1] est la bibliothèque de l'analyseur J'utilise.

Et voici où je suis chargement et la lecture audio:

loadAudio = function() { audio $ [0] .src = '/ enregistrements /' + playlist [courant] .recordingSid $ audio [0] .addEventListener ('canplaythrough', playAudio) audio $ [0] .load() }

playAudio = function() { scope.addSignal (source) audio $ [0] .play() }

Je l'avais en fait travaillé un peu, mais c'était peut-être un bug dans le chrome qui permettait de jouer, qui a cessé de fonctionner quand Chrome a été mis à jour.

Si je commente le source = context.createMediaElementSource($audio)

L'audio va jouer (juste sans visualisations) et vice versa. Je me demande s'il y a quelque chose dans le code de l'oscilloscope qui couperait le flux audio pour une raison quelconque, ou quelque chose que je dois faire pour connecter le source ou scope au nœud audio. J'ai vu quelque chose sur la connexion des flux dans le documentation

J'ai temporairement résolu ce problème en clonant le nœud audio, de sorte que j'ai un nœud pour l'audio réel, et un nœud pour l'oscilloscope, mais il se sent négligé.

Appréciez toutes les idées ou les pointeurs. Je pensais que c'était un problème de CORS au début BTW, mais j'ai résolu cela afin que mon serveur agit comme un proxy local pour les enregistrements de twilio.

Répondre

0

Ah, juste besoin

source.connect(context.destination)

après

scope.addSignal(source, options.color)