En HTML5, ¿puedo reproducir el mismo sonido más de una vez al mismo tiempo?

Question

Estoy haciendo un juego, en el que a menudo se reproducen sonidos. Noté que un sonido no se reproducirá mientras se está reproduciendo. Por ejemplo, el jugador colisiona con una pared, se reproduce un sonido "golpe". Pero, si el jugador colisiona con una pared y luego colisiona rápidamente con otra pared, solo se reproduce un sonido "thump", y creo que esto sucede porque el primer sonido no finalizó. ¿Es eso cierto? ¿Cómo debo evitar esto? Pensé en la precarga del sonido tres veces, siempre jugando una copia diferente de ese sonido, pero esto parece bastante estúpida ...

resuelto:

resulta que estaba bien ... Usted necesito para precargar múltiples versiones del sonido y luego tocarlas circularmente.

el código:

var ns = 3; //The number of sounds to preload. This depends on how often the sounds need to be played, but if too big it will probably cause lond loading times. 
var sounds = []; //This will be a matrix of all the sounds 

for (i = 0; i < ns; i ++) //We need to have ns different copies of each sound, hence: 
    sounds.push([]); 

for (i = 0; i < soundSources.length; i ++) 
    for (j = 0; j < ns; j ++) 
     sounds[j].push(new Audio(sources[i])); //Assuming that you hold your sound sauces in a "sources" array, for example ["bla.wav", "smile.dog" "scream.wav"] 

var playing = []; //This will be our play index, so we know which version has been played the last. 

for (i = 0; i < soundSources.length; i ++) 
    playing[i] = 0; 

playSound = function(id, vol) //id in the sounds[i] array., vol is a real number in the [0, 1] interval 
{ 
    if (vol <= 1 && vol >= 0) 
     sounds[playing[id]][id].volume = vol; 
    else 
     sounds[playing[id]][id].volume = 1; 

    sounds[playing[id]][id].play(); 
    ++ playing[id]; //Each time a sound is played, increment this so the next time that sound needs to be played, we play a different version of it, 

    if (playing[id] >= ns) 
     playing[id] = 0; 
} 

Answer 1

Cargar las varias veces de sonido para simular la polifonía. Juega en forma de round robin. Mira mi demo al matthewtoledo.com. Específicamente, la función _initSoundBank()

Answer 2

Sí, un solo objeto <audio> solo puede reproducir una pista a la vez. Tenga en cuenta que el objeto <audio> tiene un atributo currentTime que indica la posición actual de la pista de audio: si un objeto <audio> pudiera reproducir varias pistas una vez, ¿qué valor reflejaría currentTime?

Consulte mi solución para un superconjunto de este problema en Is playing sound in Javascript performance heavy?. (Básicamente, añadir duplicados <audio> etiquetas con el mismo sonido.)

Answer 3

pesar de que sólo se implementa en Firefox y Chrome en este momento, en el futuro, se debe utilizar la API WebAudio, que está diseñado específicamente para juegos y aplicaciones de audio en el navegador.

Allí puede reproducir cualquier sonido varias veces y hacer muchas otras cosas divertidas con él.

Un buen tutorial para eso está aquí: http://www.html5rocks.com/en/tutorials/webaudio/games/

Answer 4

Puede clonar el elemento de audio. No sé si puedes tocarlos más de una vez al mismo tiempo, pero así es como puedes reproducir un sonido más de una vez sin descargarlo más de una vez.

var sound = document.getElementById("incomingMessageSound") 
var sound2 = sound.cloneNode() 
sound.play() 
sound2.play() 

Sé que esto funciona para Chrome, que es el único lugar donde lo necesitaba. ¡Buena suerte!