web-dev-qa-db-fra.com

Cross-platform, cross-browser way to play sound from Javascript?

J'écris une application dhtml qui crée une simulation interactive d'un système. Les données pour la simulation sont générées à partir d'un autre outil, et il existe déjà une très grande quantité de données héritées.

Certaines étapes de la simulation nécessitent que nous lisions des clips audio "voix off". Je n'ai pas réussi à trouver un moyen facile d'accomplir cela sur plusieurs navigateurs.

Soundmanager2 est assez proche de ce dont j'ai besoin, mais il ne jouera que des fichiers mp3, et les données héritées peuvent également contenir des fichiers .wav.

Quelqu'un at-il d'autres bibliothèques qui pourraient aider?

javascriptaudiocross-browsercross-platformdhtml
79
Jake Stevenson

Vous devrez inclure un plug-in comme Real Audio ou QuickTime pour gérer le fichier .wav, mais cela devrait fonctionner ...

//======================================================================
var soundEmbed = null;
//======================================================================
function soundPlay(which)
    {
    if (!soundEmbed)
        {
        soundEmbed = document.createElement("embed");
        soundEmbed.setAttribute("src", "/snd/"+which+".wav");
        soundEmbed.setAttribute("hidden", true);
        soundEmbed.setAttribute("autostart", true);
        }
    else
        {
        document.body.removeChild(soundEmbed);
        soundEmbed.removed = true;
        soundEmbed = null;
        soundEmbed = document.createElement("embed");
        soundEmbed.setAttribute("src", "/snd/"+which+".wav");
        soundEmbed.setAttribute("hidden", true);
        soundEmbed.setAttribute("autostart", true);
        }
    soundEmbed.removed = false;
    document.body.appendChild(soundEmbed);
    }
//======================================================================
62
dacracot

Si vous utilisez Prototype, la bibliothèque Scriptaculous possède une API audio . jQuery semble avoir un plugin , aussi.

10
ceejayoz

le code dacracots est un dom de base propre, mais peut-être écrit sans arrière-pensée? Bien sûr, vous vérifiez d'abord l'existence d'une incorporation antérieure et enregistrez les lignes de création d'insertion en double.

var soundEmbed = null;
//=====================================================================

function soundPlay(which)
{
    if (soundEmbed)
       document.body.removeChild(soundEmbed);
    soundEmbed = document.createElement("embed");
    soundEmbed.setAttribute("src", "/snd/"+which+".wav");
    soundEmbed.setAttribute("hidden", true);
    soundEmbed.setAttribute("autostart", true);
    document.body.appendChild(soundEmbed);
}

Je suis tombé sur les pensées ici lors de la recherche d'une solution pour une situation quelque peu similaire. Malheureusement, mon navigateur Mozilla/5.0 (X11; U; Linux i686; en-US; rv: 1.9.0.15) Gecko/2009102814 Ubuntu/8.04 (hardy) Firefox/3.0.15 meurt en essayant cela.

Après l'installation des dernières mises à jour, Firefox se bloque toujours, opera reste en vie.

9
joshoreefe

Je crois que le moyen le plus simple et le plus pratique serait de jouer le son à l'aide d'un petit clip Flash. J'apprécie que ce n'est pas une solution JavaScript mais c'est IS la façon la plus simple d'atteindre votre objectif

Quelques liens supplémentaires de la précédente question similaire :

8
Ilya Kochetov

J'ai aimé la réponse de dacracot ... voici une solution similaire dans jQuery:

function Play(sound) {
    $("#sound_").remove()
    $('body').append('<embed id="sound_" autostart="true" hidden="true" src="/static/sound/' + sound + '.wav" />');
}
6
Howard

Vous pouvez utiliser le HTML5 <audio> tag.

5
Alon Gubkin

Si vous utilisez Mootools, il y a plugin MooSound .

4
cheeaun
<audio controls>
  <source src="horse.ogg" type="audio/ogg">
  <source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>

Voir http://www.w3schools.com/html/html5_audio.asp pour plus de détails.

3
Andrew Mackenzie

Il existe une solution beaucoup plus simple à cela plutôt que d'avoir à recourir à des plug-ins. IE a sa propre propriété bgsound et il existe une autre façon de la faire fonctionner pour tous les autres navigateurs. Consultez mon tutoriel ici = http: //www.andy-howard. com/comment-jouer-sons-cross-browser-including-ie/index.html

1
Andrew Junior Howard