diff options
author | julieng <julien.gattelier@gmail.com> | 2021-10-02 17:20:14 +0200 |
---|---|---|
committer | SphinxKnight <SphinxKnight@users.noreply.github.com> | 2021-10-02 17:30:20 +0200 |
commit | c05efa8d7ae464235cf83d7c0956e42dc6974103 (patch) | |
tree | 6ea911b2f2010f63a026de6bb7a1a51e7690a7e1 /files/fr/web/api/mediasource/index.md | |
parent | 13a5e017558b248ee1647d4a5825f183b51f09ad (diff) | |
download | translated-content-c05efa8d7ae464235cf83d7c0956e42dc6974103.tar.gz translated-content-c05efa8d7ae464235cf83d7c0956e42dc6974103.tar.bz2 translated-content-c05efa8d7ae464235cf83d7c0956e42dc6974103.zip |
move *.html to *.md
Diffstat (limited to 'files/fr/web/api/mediasource/index.md')
-rw-r--r-- | files/fr/web/api/mediasource/index.md | 151 |
1 files changed, 151 insertions, 0 deletions
diff --git a/files/fr/web/api/mediasource/index.md b/files/fr/web/api/mediasource/index.md new file mode 100644 index 0000000000..b472be76ed --- /dev/null +++ b/files/fr/web/api/mediasource/index.md @@ -0,0 +1,151 @@ +--- +title: MediaSource +slug: Web/API/MediaSource +tags: + - API + - Audio + - Experimental + - Extensions + - Interface + - MSE + - Media + - MediaSource + - MediaSource Extensions + - Reference + - TopicStub + - Video +translation_of: Web/API/MediaSource +--- +<p>{{APIRef("Media Source Extensions")}}{{SeeCompatTable}}</p> + +<p>L'interface <strong><code>MediaSource</code></strong> de l'<a href="/en-US/docs/Web/API/Media_Source_Extensions_API">API Media Source Extensions</a> représente une source de données multimédia pour un objet {{domxref("HTMLMediaElement")}}. Un objet <code>MediaSource</code> peut être attaché à un {{domxref("HTMLMediaElement")}} pour être lu dans l'agent utilisateur.</p> + +<p>{{InheritanceDiagram}}</p> + +<h2 id="Constructeur">Constructeur</h2> + +<dl> + <dt>{{domxref("MediaSource.MediaSource", "MediaSource()")}}</dt> + <dd>Construit et renvoie un nouvel objet <code>MediaSource</code> sans tampon source associé.</dd> +</dl> + +<h2 id="Propriétés">Propriétés</h2> + +<dl> + <dt>{{domxref("MediaSource.sourceBuffers")}} {{readonlyInline}}</dt> + <dd>Renvoie un objet {{domxref("SourceBufferList")}} contenant la liste des objets {{domxref("SourceBuffer")}} associés à ce <code>MediaSource</code>.</dd> + <dt>{{domxref("MediaSource.activeSourceBuffers")}} {{readonlyInline}}</dt> + <dd>Renvoie un objet {{domxref("SourceBufferList")}} contenant un sous-ensemble des objets {{domxref("SourceBuffer")}} contenus dans {{domxref("MediaSource.sourceBuffers")}} — la liste des objets fournissant la piste vidéo sélectionnée, pistes audio activées et pistes de texte affichées / masquées.</dd> + <dt>{{domxref("MediaSource.readyState")}} {{readonlyInline}}</dt> + <dd>Renvoie une énumération représentant l'état de la <code>MediaSource</code> actuelle, qu'elle ne soit pas actuellement attachée à un élément multimédia (<code>fermé</code>), attachée et prête à recevoir des objets {{domxref("SourceBuffer")}} (<code>ouvert</code>), ou attachée mais le flux a été terminé via {{domxref("MediaSource.endOfStream()")}} (<code>terminé</code>).</dd> + <dt>{{domxref("MediaSource.duration")}}</dt> + <dd>Obtient et définit la durée du média actuel présenté.</dd> +</dl> + +<h3 id="Gestionnaires_dévénements">Gestionnaires d'événements</h3> + +<dl> + <dt>{{domxref("MediaSource.onsourceclose")}}</dt> + <dd>Le gestionnaire d'événements pour l'événement <code>sourceclose</code>.</dd> + <dt>{{domxref("MediaSource.onsourceended")}}</dt> + <dd>Le gestionnaire d'événements pour l'événement <code>sourceended</code>.</dd> + <dt>{{domxref("MediaSource.onsourceopen")}}</dt> + <dd>Le gestionnaire d'événements pour l'événement <code>sourceopen</code>.</dd> +</dl> + +<h2 id="Méthodes">Méthodes</h2> + +<p><em>Hérite des méthodes de son interface parente, {{domxref("EventTarget")}}.</em></p> + +<dl> + <dt>{{domxref("MediaSource.addSourceBuffer()")}}</dt> + <dd>Crée un nouveau {{domxref ("SourceBuffer")}} du type MIME donné et l'ajoute à la liste {{domxref ("MediaSource.sourceBuffers")}}.</dd> + <dt>{{domxref("MediaSource.clearLiveSeekableRange()")}}</dt> + <dd>Efface un ensemble privé de plage de recherche avec un appel à <code>setLiveSeekableRange()</code>.</dd> + <dt>{{domxref("MediaSource.endOfStream()")}}</dt> + <dd>Signale la fin du flux.</dd> + <dt>{{domxref("MediaSource.removeSourceBuffer()")}}</dt> + <dd>Supprime le {{domxref ("SourceBuffer")}} donné de la liste {{domxref ("MediaSource.sourceBuffers")}}.</dd> + <dt>{{domxref("MediaSource.setLiveSeekableRange()")}}</dt> + <dd>Définit la plage que l'utilisateur peut rechercher dans l'élément multimédia.</dd> +</dl> + +<h2 id="Méthodes_statiques">Méthodes statiques</h2> + +<dl> + <dt>{{domxref("MediaSource.isTypeSupported()")}}</dt> + <dd>Renvoie une valeur {{domxref ("Boolean")}} indiquant si le type MIME donné est pris en charge par l'agent utilisateur actuel - c'est-à-dire s'il parvient à créer des objets {{domxref ("SourceBuffer")}} pour ce type MIME .</dd> +</dl> + +<h2 id="Exemples">Exemples</h2> + +<p>L'exemple simple suivant charge une vidéo avec {{domxref ("XMLHttpRequest")}} et la lit dès que possible. Cet exemple a été écrit par Nick Desaulniers et peut être <a href="http://nickdesaulniers.github.io/netfix/demo/bufferAll.html">consulté en direct ici</a> (vous pouvez aussi <a href="https://github.com/nickdesaulniers/netfix/blob/gh-pages/demo/bufferAll.html">télécharger la source</a> pour une enquête plus approfondie).</p> + +<pre class="brush: js">var video = document.querySelector('video'); + +var assetURL = 'frag_bunny.mp4'; +// Need to be specific for Blink regarding codecs +// ./mp4info frag_bunny.mp4 | grep Codec +var mimeCodec = 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"'; + +if ('MediaSource' in window && MediaSource.isTypeSupported(mimeCodec)) { + var mediaSource = new MediaSource(); + //console.log(mediaSource.readyState); // closed + video.src = URL.createObjectURL(mediaSource); + mediaSource.addEventListener('sourceopen', sourceOpen); +} else { + console.error('Unsupported MIME type or codec: ', mimeCodec); +} + +function sourceOpen (_) { + //console.log(this.readyState); // open + var mediaSource = this; + var sourceBuffer = mediaSource.addSourceBuffer(mimeCodec); + fetchAB(assetURL, function (buf) { + sourceBuffer.addEventListener('updateend', function (_) { + mediaSource.endOfStream(); + video.play(); + //console.log(mediaSource.readyState); // ended + }); + sourceBuffer.appendBuffer(buf); + }); +}; + +function fetchAB (url, cb) { + console.log(url); + var xhr = new XMLHttpRequest; + xhr.open('get', url); + xhr.responseType = 'arraybuffer'; + xhr.onload = function () { + cb(xhr.response); + }; + xhr.send(); +};</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + <tr> + <td>{{SpecName('Media Source Extensions', '#mediasource', 'MediaSource')}}</td> + <td>{{Spec2('Media Source Extensions')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<p>{{Compat("api.MediaSource")}}</p> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li>{{domxref("SourceBuffer")}}</li> + <li>{{domxref("SourceBufferList")}}</li> +</ul> |