2013-02-27 14 views

risposta

17

Non sicuro se questo risponde alla tua domanda ma puoi eseguire l'audio del video attraverso il grafico del nodo dell'API Web Audio. Il codice sottostante può essere dimostrato cambiando il guadagno e i parametri del filtro. L'ho provato solo su Chrome.

<!DOCTYPE html> 
<meta charset="UTF-8"> 
<title></title> 
<body> 

</body> 


<script> 

var video = document.createElement("video"); 
video.setAttribute("src", "ourMovie.mov"); 

video.controls = true; 
video.autoplay = true; 
document.body.appendChild(video); 

var context = new webkitAudioContext(); 
var gainNode = context.createGain(); 
gainNode.gain.value = 1;     // Change Gain Value to test 
filter = context.createBiquadFilter(); 
filter.type = 2;       // Change Filter type to test 
filter.frequency.value = 5040;   // Change frequency to test 

// Wait for window.onload to fire. See crbug.com/112368 
window.addEventListener('load', function(e) { 
    // Our <video> element will be the audio source. 
    var source = context.createMediaElementSource(video); 
    source.connect(gainNode); 
    gainNode.connect(filter); 
    filter.connect(context.destination); 

}, false); 


</script> 

Il codice di cui sopra è una versione modificata di questo: http://updates.html5rocks.com/2012/02/HTML5-audio-and-the-Web-Audio-API-are-BFFs

ho semplicemente sostituito l'elemento audio con l'elemento video.

+0

Non sapevo che è possibile eseguire che su elementi video! Grazie, questo è esattamente quello che volevo! – jreptak

+0

bello, post davvero utile! – ejectamenta

+0

'webkitAudioContext' è deprecato. Si prega di utilizzare 'AudioContext' invece. –

0

Webm funziona come una fonte audio.

<audio controls="controls" class="full-width" preload="metadata"> 
 
    <source src="//rack.international/samples/sample.webm" type="audio/mpeg"> 
 
</audio>

<video src="https://rack.international/samples/sample.webm" controls> 
 
    <p>Your browser doesn't support HTML5 video. Here is a <a href="rabbit320.webm">link to the video</a> instead.</p> 
 
</video>