web-dev-qa-db-fra.com

Comment détecter le support MP3 audio HTML5?

Je sais comment vérifier en Javascript si la lecture audio HTML5 est disponible. Mais comment puis-je vérifier spécifiquement si la lecture audio MP3 est disponible, comme IE9 et Chrome le prend en charge, tandis que Firefox et Opera ne le font pas).

35
footy

Vous pouvez soit vérifier l'agent utilisateur et voir quel navigateur est utilisé, soit tester la prise en charge avec Javascript.

var a = document.createElement('audio');
return !!(a.canPlayType && a.canPlayType('audio/mpeg;').replace(/no/, ''));

J'ai obtenu le code ci-dessus de cette page .

!! (a.canPlayType) est meilleur car (certaines versions récentes de) Firefox ne prend pas en charge le mp3 et a.canPlayType ('audio/mpeg;') sera faux

62
keyboardP

Modernizr est une bibliothèque de détection de fonctionnalités. Vous pouvez l'utiliser pour faire le travail à votre place.

Selon la documentation :

Si la prise en charge audio est détectée, Modernizr évalue les formats que le navigateur actuel lira. Actuellement, Modernizr teste ogg, mp3, wav et m4a.

Important: Les valeurs de ces propriétés ne sont pas de véritables booléens. Au lieu de cela, Modernizr correspond à la spécification HTML5 en renvoyant une chaîne représentant le niveau de confiance du navigateur qu'il peut gérer ce codec. Ces valeurs de retour sont une chaîne vide (réponse négative), "peut-être" et "probablement". La chaîne vide est fausse, en d'autres termes: Modernizr.audio.ogg == '' et '' == false

4
Tim
var test_audio= document.createElement("audio") //try and create sample audio element 
var test_video= document.createElement("video") //try and create sample video element
var mediasupport={audio: (test_audio.play)? true : false, video: (test_video.play)? true :     false}

alert("Audio Element support: " + mediasupport.audio + "\n"
+ "Video Element support: " + mediasupport.video
)
3
Shoaib Iqbal