web-dev-qa-db-fra.com

Lecture audio html5 dans Android

J'ai un javascript qui lit l'audio dans le navigateur, en utilisant le html5 <audio> tag. Cela fonctionne bien dans le navigateur iPhone, mais pas dans Android. (Test en utilisant un désir htc avec Android 2.1.) Quelqu'un sait pourquoi?

Mon code:

   function playHTML5(sound, soundcv){
                // sound = url to m4a audio file
                // soundcv = div in which the audioplayer should go

  var audio = document.createElement('audio');
  audio.src = sound;
  audio.controls = "controls";
  if (currentSound != null){
   soundcv.replaceChild(audio,currentSound);
  } else {
   soundcv.appendChild(audio);
  }
  currentSound = audio;
 }

Soit dit en passant, j'essaie également d'agrandir le bouton audio qui apparaît dans l'iphone (celui par défaut est assez petit), sans succès jusqu'à présent - je serais reconnaissant pour toutes les idées!

20

Le dernier Android dans FroYo ne prend pas encore en charge l'élément audio HTML5. Il ne s'agit pas d'un bogue, mais plutôt d'une fonctionnalité qui n'a pas encore été implémentée. Il peut arriver dans Gingerbread.

Mise à jour: le navigateur Gingerbread possède l'élément audio.

14

Voici le lien vers Google Android bug, qui a signalé le manque de support du tag AUDIO dans Android. S'il vous plaît, votez dessus.

http://code.google.com/p/Android/issues/detail?id=10546

BTW, il y a du travail autour, qui vous permet de jouer nativement MP3 en Android 1.6 .. 2.2, comme ça:

<video src="test.mp3" onclick="this.play();"></video>
13
Slavik

Je ne peux pas comprendre cela non plus. MAIS, cette page de test créée par Apple lit l'audio HTML5 sur Android: http://www.Apple.com/html5/showcase/audio

comment a fait Apple?

4
Rick

J'avais des problèmes avec mon Kindle Fire et j'ai trouvé une petite chose qui semblait y remédier.

<audio>
  <source src="someclip.mp3" type="audio/mpeg" />
</audio>

J'avais utilisé par erreur "audio/mp3". J'utilise un lecteur sans ses contrôles natifs (en utilisant HTML5/JS).

1
Kevin

Je l'ai fait travailler sur un projet en utilisant trigger.io déployant sur un Nexus 7 exécutant Android Jellybean, mais l'audio ne joue que si j'utilise des URL absolues pour le moment. Je ne suis pas sûr du chemin relatif à utiliser pour l'audio de mon projet, mais j'espère que cela aidera quelqu'un ...

(function() {

    var currentSound;
    // I have a div called "page"
    var soundcv = document.body;

    // This only works for one sound for simplicity's sake
    function playSound(sound){

        if (currentSound == null){
            var audio = document.createElement('audio');
            audio.src = sound;
            soundcv.appendChild(audio);
            currentSound = audio;
        }

        currentSound.play();
    }

    // This isn't a real audio file URL - replace it with one of your own
    playSound('http://example.com/example.mp3');
})();
1
gavD_UK

Avez-vous vérifié votre format audio ?

1
Jla

J'ai bricolé toute la journée à ce sujet et j'ai finalement fait travailler le mien sur mon ancien navigateur Samsung Droid avec le yahoo webplayer:

<a href="somefolder/file.mp3"></a>
<script type="text/javascript" src="http://webplayer.yahooapis.com/player.js"></script>

Fonctionne très bien met une petite icône de flèche à côté du texte sur lequel vous pouvez cliquer pour lire votre mp3. Merci Yahoo.

J'ai oublié de mentionner que l'audio n'apparaît PAS dans mon Chrome ou navigateur Firefox lors du test local. Fonctionne très bien sur le navigateur de mon téléphone cependant.

0
Robert Beltran

Je sais que c'est un hack, mais ça marche partout (pour autant que je sache)!

Vous pouvez utiliser l'élément vidéo et convertir vos mp3 en fichiers mp4 et ogg (ogg pour firefox sur Android). Vous pouvez également le styliser pour qu'il n'affiche pas de joueurs par défaut inutiles. Voir le code ci-dessous:

<video id="audioTest" width="1" height="1" style="top: -100px; left: -100px; position: absolute;" preload >
    <source src="audio.mp4" type="video/mp4">
    <source src="audio.ogv" type="video/ogg">
</video>

Vous pouvez ensuite le jouer dans votre code js en utilisant:

var audioTest = document.getElementById("audioTest");
audioTest.addEventListener("ended",onSoundComplete,false);
audioTest.play();
0
Nikos