Lecture multimédia en HTML5

Lorsque nous travaillons sur le Web, nous devons nous assurer que chaque utilisateur a une expérience satisfaisante sur notre page, ce qui implique plusieurs fois de devoir créer du code supplémentaire ou moins efficace, le tout pour que notre page ne tombe pas en panne.
Avec la nouvelle norme HTML nous avons les nouveaux éléments multimédias, tels que l'audio et la vidéo, puisque les deux ont une origine commune, nous pouvons évaluer leurs formats et ainsi savoir si le navigateur peut ou non lire les fichiers spécifiés.
Méthode CanPlayType
La méthode canPlayType Il nous permet de savoir ou d'avoir une idée si le navigateur peut ou non lire le fichier multimédia que nous indiquons.
En utilisant cette méthode, nous pouvons avoir 3 types de réponse :

• “” vide cela nous indique que vous ne pouvez pas lire le fichier dans le format spécifié.
• peut être cette réponse nous dit que le format peut être jouable.
• Probablement Avec cette réponse, le navigateur nous dit qu'il y a de fortes probabilités qu'il puisse reproduire le contenu dans le format spécifié.

Voyons ci-dessous un code où nous utilisons cette méthode sur un fichier multimédia :

 Exemple La vidéo ne peut pas être affichée 
 
Biens
Valeur

 

 

Ici simplement ce que nous faisons est d'effectuer deux tableaux, dans le premier nous plaçons les noms des fichiers avec différentes extensions, dans le second nous plaçons les formats que nous avons, une fois avec cela nous parcourons le tableau des formats et ensuite nous évaluons avec la méthode canPlaytype afin d'obtenir la réponse dont nous avons besoin.
Jusqu'à présent, tout se passe bien, une fois que nous avons l'évaluation, nous demandons qui a retourné la réponse Probablement et c'est celui que nous allons placer pour la reproduction.
Voyons à quoi cela ressemble dans le navigateur :

Dans cet exemple spécifique, nous utilisons Firefox, dans ce cas le format que le navigateur peut reproduire est le webm et c'est effectivement celui qui figure dans l'élément correspondant.
Comme nous pouvons le voir, cette méthode nous permet d'établir plusieurs options et si nous développons correctement notre algorithme, nous pouvons effectuer une fonctionnalité très robuste qui nous permettra de profiter des avantages de HTML5 dans la gestion du multimédia dans plusieurs navigateurs sans avoir à se soucier de l'expérience utilisateur.
Avec cela, nous terminons notre didacticiel, sachant maintenant comment évaluer les différents formats multimédias et comment les navigateurs peuvent traiter chacun d'eux.Avez-vous aimé et aidé ce tutoriel ?Vous pouvez récompenser l'auteur en appuyant sur ce bouton pour lui donner un point positif