Combat réel HTML5 et analyse des éléments multimédias (4. Détection du support des codecs et du constructeur audio)

Les éléments multimédias HTML5 détectent la prise en charge des codecs

Bien que les éléments multimédias puissent implémenter des fonctions audio et vidéo, ils ne le sont pas. Tous les navigateurs prennent tous en charge codecs pour la balise vidéo et la balise audio, ce qui signifie que les développeurs doivent fournir de nombreuses sources multimédias. L'API JavaScript peut détecter si le navigateur prend en charge un certain format et codec. Les deux éléments multimédias ont une méthode canPlayType() qui accepte une chaîne de format/codec et renvoie « probablement », « peut-être » ou « » (chaîne vide). La chaîne vide est une valeur fausse, et "probablement" et "peut-être" sont tous deux des valeurs vraies, elle peut donc être convertie en vrai dans le test de condition if, afin qu'elle puisse être utilisée comme condition de jugement dans le test de condition if. La méthode de détection du format/codec est la suivante

　Code JavaScript

if(audio.canPlayType("audio/mpeg")){
	//进一步编写
}

S'il est transmis à canPlayType( ) Si un type MIME est saisi, la valeur de retour sera probablement "peut-être" ou une chaîne vide. En effet, le fichier multimédia lui-même n'est qu'un conteneur pour l'audio ou la vidéo. Ce qui détermine réellement si le fichier peut être lu, c'est le format d'encodage. En passant à la fois un type MIME et un encodeur, la probabilité augmente que la chaîne renvoyée devienne « probablement ». Un petit exemple est le suivant

　Code HTML

<audio src="meng.ogg" id="myAudio"></audio>

　 Code JavaScript

var audio = document.getElementById("myAudio");

//很可能"maybe"
if(audio.canPlayType("audio/mpeg")){
	//进一步编写
}

//可能是"probably"
if(audio.canPlayType("audio/ogg; codecs=\"vorbis\"")){
	//进一步编写
}

Le codec doit être mis entre guillemets. Ce qui suit est une introduction aux formats audio et codecs pris en charge.

Format AAC : chaîne audio/mp4, codecs="mp4a.40.2" ; Navigateurs pris en charge : IE9, Safari 4 et Safari pour iOS

Format MP3 : chaîne audio/mpeg ; IE9, Chrome

Format Vorbis : string audio/ogg, codecs="vorbis" ; Navigateurs pris en charge : Firefox 3.5, Chrome, Opera 10.5

Format WAV : String audio/wav, codecs=" 1" ; Navigateurs pris en charge : Firefox 3.5, Opera 10.5, Chrome

Ce qui suit utilise canPlayType() pour détecter le codec du format vidéo.

Format H.264 : string video/mp4, codecs="avc1.42E01E, mp4a.40.2" ; Navigateurs pris en charge : IE9, Safari 4, Safari pour iOS, Webkit pour Android

Theora : string video/ogg, codecs="theora"; navigateurs pris en charge : Firefox 3.5, Opera 10.5, Chrome

WebM : video/webm, codecs="vp8, vorbis" ; navigateurs pris en charge : Firefox 4, Opera 10.6 , Chrome

Élément multimédia HTML5 Constructeur audio

En JavaScript natif, il existe un constructeur Audio, L'audio peut être joué à tout moment. Du point de vue des deux éléments DOM, l'objet Audio est très similaire à l'objet Image, mais l'objet Audio n'a pas besoin d'être inséré dans le document comme l'objet Image. Créez simplement une nouvelle instance et transmettez le fichier source audio. Un petit exemple est le suivant

　Code JavaScript

var audio = new Audio("meng.mp3");
audio.addEventListener('canplaythrough',function(event){
	audio.play();
}, false);	

Créez une nouvelle instance audio pour commencer à télécharger le fichier spécifié. Une fois le téléchargement terminé, appelez la méthode play() pour lire l'audio. Sous iOS, lors de l'appel de play(), une boîte de dialogue apparaîtra et la lecture ne pourra être lue qu'après avoir obtenu l'autorisation de l'utilisateur. Si vous souhaitez lire l'autre extrémité de l'audio après avoir lu un morceau d'audio, vous devez appeler la méthode play() dans le gestionnaire d'événements onfinish.

Ce qui précède est le contenu du combat réel HTML5 et de l'analyse des éléments multimédias (4. Test de la prise en charge du codec et du constructeur audio. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (www.php.cn). )!