shaka player

Shaka Player est une bibliothèque JavaScript open source pour les médias adaptatifs. Il lit les formats multimédias adaptatifs (tels que DASH, HLS et MSS) dans un navigateur, sans utiliser de plugins ni Flash. Au lieu de cela, Shaka Player utilise les standards Web ouverts MediaSource Extensions et Encrypted Media Extensions.

Shaka Player prend également en charge le stockage et la lecture hors ligne de médias à l'aide d'IndexedDB. Le contenu peut être stocké sur n'importe quel navigateur. Le stockage des licences dépend de la prise en charge du navigateur.

Notre objectif principal est de rendre aussi simple que possible la diffusion de flux vidéo et audio à débit adaptatif à l'aide des technologies de navigateur modernes. Nous essayons de garder la bibliothèque légère, simple et exempte de dépendances tierces. Tout ce dont vous avez besoin pour créer et déployer se trouve dans les sources.

Pour plus de détails sur les prochaines étapes, consultez notre feuille de route de développement.

Succursales entretenues

Voir maintenu-branches.md pour la liste à jour des branches maintenues de Shaka Player.

Matrice de prise en charge des plates-formes et des navigateurs

Navigateur	Fenêtres	Mac	Linux	Androïde	iOS >= 9	iOS >= 17.1	iPadOS >= 13	Chrome OS	Autre
Chrome¹	Oui	Oui	Oui	Oui	Indigène	Indigène	Indigène	Oui	-
Firefox¹	Oui	Oui	Oui	non testé⁵	Indigène	Indigène	Indigène	-	-
Bord¹	Oui	-	-	-	-	-	-	-	-
Bord Chrome	Oui	Oui	Oui	non testé⁵	Indigène	Indigène	Indigène	-	-
IE	N	-	-	-	-	-	-	-	-
Safari¹	-	Oui	-	-	Indigène	Oui	Oui	-	-
Opéra¹	Oui	Oui	Oui	non testé⁵	Indigène	-	-	-	-
Chromecast².	-	-	-	-	-	-	-	-	Oui
Tizen TV³	-	-	-	-	-	-	-	-	Oui
WebOS⁶	-	-	-	-	-	-	-	-	Oui
Hisense⁷	-	-	-	-	-	-	-	-	Oui
Xbox Un	-	-	-	-	-	-	-	-	Oui
Playstation 4⁷	-	-	-	-	-	-	-	-	Oui
Playstation 5⁷	-	-	-	-	-	-	-	-	Oui

REMARQUES :

• ¹ : Sur macOS, seul Safari 9+ est pris en charge. Sur iOS, seul iOS 9+ est pris en charge. Les anciennes versions seront rejetées.
• ² : Le dernier micrologiciel stable du Chromecast est testé. L'expéditeur et le destinataire peuvent être implémentés avec Shaka Player.
• ³ : Le modèle Tizen 2017 est activement testé et pris en charge par l'équipe Shaka Player. Le modèle Tizen 2016 est soutenu par la communauté et n'a pas été testé par nous.
• ⁵ : Ceux-ci devraient fonctionner, mais ne sont pas activement testés par l'équipe Shaka Player.
• ⁶ : Ceux-ci devraient fonctionner, mais sont soutenus par la communauté et n'ont pas été testés par nous.
  • Prise en charge officielle de LG WebOS TV : #1330
• ⁷ : Ceux-ci devraient fonctionner, mais sont soutenus par la communauté et n'ont pas été testés par nous.

REMARQUES pour iOS et iPadOS :

• Nous prenons en charge iOS 9+ via le lecteur HLS natif d'Apple. Nous fournissons la même API de niveau supérieur, mais nous définissons simplement l'élément src de la vidéo sur le manifeste/média. Nous dépendons donc du navigateur prenant en charge les manifestes.
• Étant donné que les extensions MediaSource pour iPadOS 13 sont prises en charge
• Étant donné que les extensions ManagedMediaSource pour iPadOS 17 et iOS 17.1 sont prises en charge

Matrice de prise en charge du format de manifeste

Format	Vidéo à la demande	En direct	Événement	Enregistrement en cours
TIRET	Oui	Oui	-	Oui
HLS	Oui	Oui	Oui	-
MSS	Oui	-	-	-

Vous pouvez également créer un plug-in d'analyseur de manifeste pour prendre en charge les formats de manifeste personnalisés.

Fonctionnalités DASH

Fonctionnalités DASH prises en charge :

• Enregistrements VOD, en direct et en cours (contenu VOD dynamique)
• MPD@timeShiftBufferDepth pour la recherche en arrière dans les flux en direct
• Contenu multi-périodes (statique et dynamique)
• Éléments Xlink (actuate=onLoad uniquement, résolution à zéro, contenu de secours)
• Toutes les formes d'informations sur l'index de segment : SegmentBase@indexRange, SegmentTimeline, SegmentTemplate@duration, SegmentTemplate@index, SegmentList
• Manifestes multi-codecs/multi-conteneurs (nous négocierons le support avec le navigateur et choisirons les meilleurs)
• Contenu chiffré (y compris les schémas ContentProtection personnalisés, PSSH dans le manifeste)
• Rotation des clés
• Pistes du mode Astuce
• WebVTT et TTML
• Légendes CEA-608/708
• Variantes multi-codecs (sur les plates-formes prenant en charge changeType)
• Chaînage MPD
• Mises à jour du correctif MPD pour SegmentTemplate avec $Nombre$ , SegmentTimeline avec $Nombre$ et SegmentTimeline avec $Temps$

Fonctionnalités DASH non prises en charge :

• Xlink avec actuate=onRequest
• Manifestes sans aucune information de segment : #1088
• Plusieurs pistes en mode astuce pour la même résolution à des fréquences d'images ou des débits binaires variables
• Échelles de temps si grandes que les horodatages ne peuvent pas être représentés sous forme d'entiers en JavaScript (2 ^ 53) : #1667
• Modification d'éléments avec un attribut @schemeIdUri via MPD Patch
• Déréférencement Xlink avec MPD Patch

Fonctionnalités HLS

Fonctionnalités HLS prises en charge :

• Types de VOD, Live et événements
• Streaming à faible latence avec segments partiels, conseils de préchargement, mises à jour delta et blocage du rechargement de la liste de lecture
• Discontinuité
• Prise en charge ISO-BMFF / MP4 / CMAF
• Prise en charge MPEG-2 TS
• WebVTT et TTML
• Légendes CEA-608/708
• Contenu crypté avec PlayReady et Widevine
• Contenu crypté avec FairPlay (Safari sur macOS et iOS 9+ uniquement)
• Prise en charge d'AES-128, AES-256 et AES-256-CTR sur les navigateurs prenant en charge l'API Web Crypto
• Prise en charge de SAMPLE-AES et SAMPLE-AES-CTR (identité) sur les navigateurs prenant en charge ClearKey
• Rotation des clés
• Raw AAC, MP3, AC-3 et EC-3 (sans conteneur MP4)
• Listes de lecture I-frame uniquement (pour la lecture astucieuse et les vignettes)
• #EXT-X-IMAGE-STREAM-INF pour les vignettes
• Interstitiels
• Changement de conteneur pendant la lecture (ex : MP4 vers TS, ou AAC vers TS)

Fonctionnalités HLS non prises en charge :

• Attribut X-SNAP dans les interstitiels

Balises HLS prises en charge

Pour plus de détails sur le format HLS et la signification de ces balises, voir https://datatracker.ietf.org/doc/html/draft-pantos-hls-rfc8216bis

Balises de playlist multivariées

• #EXT-X-STREAM-INF:<attribute-list> <URI>
• #EXT-X-MEDIA:<attribute-list>
• #EXT-X-IMAGE-STREAM-INF:<attribute-list>
• #EXT-XI-FRAME-STREAM-INF:<attribute-list>
• #EXT-X-SESSION-DATA:<attribute-list>
• #EXT-X-SESSION-KEY:<attribute-list> Sélection et préchargement du système de clés EME
• #EXT-X-START:TIME-OFFSET=<n>
• #EXT-X-CONTENT-STEERING:<attribute-list> Pilotage du contenu
• #EXT-X-DEFINE:<attribute-list> Substitution de variables (attributs NAME,VALUE,QUERYPARAM )

Balises de la liste de lecture multimédia

• #EXTM3U
• #EXTINF:<duration>,[<title>]
• #EXT-X-PLAYLIST-TYPE:<type
• #EXT-X-ENDLIST
• #EXT-X-MEDIA-SEQUENCE=<n>
• #EXT-X-TARGETDURATION=<n>
• #EXT-X-DISCONTINUITY
• #EXT-X-DISCONTINUITY-SEQUENCE=<n>
• #EXT-X-BYTERANGE=<n>[@<o>]
• #EXT-X-MAP:<attribute-list>
• #EXT-X-KEY:<attribute-list> ( KEYFORMAT="identity",METHOD=SAMPLE-AES n'est pris en charge qu'avec les segments MP4)
• #EXT-X-PROGRAM-DATE-TIME:<attribute-list>
• #EXT-X-START:TIME-OFFSET=<n>
• #EXT-X-SERVER-CONTROL:<attribute-list>
• #EXT-X-PART-INF:PART-TARGET=<n>
• #EXT-X-PART:<attribute-list>
• #EXT-X-SKIP:<attribute-list> Listes de lecture Delta
• #EXT-X-DATERANGE:<attribute-list> Métadonnées
• #EXT-X-DEFINE:<attribute-list> Importation et substitution de variables (attributs NAME,VALUE,IMPORT,QUERYPARAM )
• #EXT-X-GAP
• #EXT-X-PRELOAD-HINT:<attribute-list>
• #EXT-X-BITRATE

Prise en charge de MPEG-5 Part2 LCEVC

Uniquement pris en charge sur les navigateurs avec prise en charge de Media Source Extensions SourceBuffer

• Prise en charge du décodage MPEG-5 Part2 LCEVC (le décodage fourni par lcevc_dec.js doit être inclus séparément)

• Documentation d'intégration : docs

• En savoir plus sur MPEG-5 Part2 LCEVC

Fonctionnalités MSS

Fonctionnalités MSS prises en charge :

• VOD
• AAC et H.264
• Contenu crypté (PlayReady)
• TTML/DFXP
• Uniquement pris en charge avec codem-isoboxer

Fonctionnalités MSS non prises en charge :

• En direct

Matrice de prise en charge DRM

Navigateur	Largevine	Prêt à jouer	Fair-play	ClearKey⁶
Chrome¹	Oui	-	-	Oui
Firefox²	Oui	-	-	Oui
Bord³	-	Oui	-	-
Bord Chrome	Oui	Oui	-	Oui
Safari	-	-	Oui	-
Opéra	Oui	-	-	Oui
Chromecast	Oui	Oui	-	Oui
Tizen TV	Oui	Oui	-	Oui
WebOS⁷	non testé⁷	non testé⁷	-	non testé⁷
Hisense⁷	non testé⁷	non testé⁷	-	non testé⁷
Xbox Un	-	Oui	-	-
Playstation 4⁷	-	non testé⁷	-	non testé⁷
Playstation 5⁷	-	non testé⁷	-	non testé⁷

Les autres systèmes DRM devraient fonctionner immédiatement s'ils sont interopérables et conformes aux spécifications EME.

REMARQUES :

• ¹ : seules les versions officielles de Chrome contiennent le CDM Widevine. Chromium créé à partir des sources ne prend pas en charge les DRM.
• ² : DRM doit être activé par l'utilisateur. La première fois qu'un utilisateur de Firefox visite un site avec des médias cryptés, il sera invité à activer le DRM.
• ³ : PlayReady dans Edge ne semble pas fonctionner sur une VM ou sur un bureau à distance.
• ⁶ : ClearKey est un outil utile pour le débogage et n'assure pas de véritable sécurité du contenu.
• ⁷ : Ceux-ci devraient fonctionner, mais sont soutenus par la communauté et n'ont pas été testés par nous.

Manifeste	Largevine	Prêt à jouer	Fair-play	Clé Effacer
TIRET	Oui	Oui	-	Oui
HLS	Oui	Oui	Oui¹	-
MSS	-	Oui	-	-

REMARQUES :

• ¹ : Par défaut, FairPlay est géré à l'aide du lecteur HLS natif d'Apple, sur Safari. Nous prenons cependant en charge FairPlay via MSE/EME. Consultez la valeur de configuration streaming.useNativeHlsForFairPlay .

Conteneur multimédia et prise en charge des sous-titres

Shaka Player prend en charge :

• ISO-BMFF / CMAF / MP4
  • Dépend de la prise en charge du navigateur pour le conteneur via MediaSource
  • Peut analyser la boîte "sidx" pour SegmentBase@indexRange et SegmentTemplate@index de DASH
  • Peut trouver et analyser la boîte "tfdt" pour trouver l'heure de début du segment dans HLS
  • Pour MSS, codem-isoboxer v0.3.7+ est requis
• WebM
  • Dépend de la prise en charge du navigateur pour le conteneur via MediaSource
  • Peut analyser les éléments de données de repérage pour SegmentBase@indexRange et SegmentTemplate@index de DASH
  • Non pris en charge dans HLS
• MPEG-2 TS
  • Peut être lu sur n'importe quel navigateur prenant en charge MP4
  • Peut rechercher et analyser les horodatages pour trouver l'heure de début du segment dans HLS
• WebVTT
  • Pris en charge sous forme de texte et intégré dans MP4
• TTML
  • Pris en charge sous forme XML et intégré dans MP4
• CEA-608
  • Pris en charge intégré dans MP4 et TS
• CEA-708
  • Pris en charge intégré dans MP4 et TS
• CAA brute
  • Pris en charge dans le conteneur AAC brut et transmuxage vers AAC dans le conteneur MP4 (dépend de la prise en charge du navigateur via MediaSource).
• MP3 brut
  • Pris en charge dans le conteneur MP3 brut et transmuxage en MP3 dans le conteneur MP4 (dépend de la prise en charge du navigateur via MediaSource).
• AC-3 brut
  • Pris en charge dans le conteneur AC-3 brut et transmuxage vers AC-3 dans le conteneur MP4 (dépend de la prise en charge du navigateur via MediaSource).
• EC-3 brut
  • Pris en charge dans le conteneur EC-3 brut et transmuxage vers EC-3 dans le conteneur MP4 (dépend de la prise en charge du navigateur via MediaSource).
• Sous-Rip (SRT)
  • Encodage UTF-8 uniquement
• Paroles (LRC)
  • Encodage UTF-8 uniquement
• Sous-Station Alpha (SSA, ASS)
  • Encodage UTF-8 uniquement
• Sous-Viewer (SBV)
  • Encodage UTF-8 uniquement

Les sous-titres sont rendus par le navigateur par défaut. Les applications peuvent créer un plugin d'affichage de texte pour le rendu client afin d'aller au-delà des attributs pris en charge par le navigateur.

Prise en charge du transmuxeur

Shaka Player prend en charge :

• AAC brut en AAC en MP4
• MP3 brut en MP3 en MP4
• AC-3 brut à AC-3 en MP4
• EC-3 brut à EC-3 en MP4
• AAC en MPEG-2 TS vers AAC en MP4
• AC-3 en MPEG-2 TS vers AC-3 en MP4
• EC-3 en MPEG-2 TS à EC-3 en MP4
• MP3 en MPEG-2 TS en MP3 en MP4
• MP3 en MPEG-2 TS en MP3 brut
• Opus en MPEG-2 TS vers MP3 en MP4
• H.264 en MPEG-2 TS vers H.264 en MP4
• H.265 en MPEG-2 TS vers H.265 en MP4
• Contenu multiplexé en MPEG-2 TS avec les codecs précédents

Prise en charge des vignettes

Shaka Player prend en charge :

• Miniatures DASH internes. Utilisation de l'ensemble d'adaptation d'image DASH-IF IOP
• Miniatures HLS internes. Utilisation de la liste de lecture multimédia d'images HLS
• Miniatures HLS internes. Utilisation de listes de lecture I-frame uniquement avec le codec mjpg
• WebVTT externe avec images/sprites (uniquement pour la VoD)

Monétisation avec des publicités

Shaka Player prend en charge :

• SDK IMA pour l'insertion d'annonces côté client
• SDK IMA DAI pour l'insertion d'annonces côté serveur
• AWS MediaTailor pour côté client
• AWS MediaTailor pour côté serveur
• Superpositions AWS MediaTailor
• Interstitiels HLS
• Insertion de présentation multimédia DASH (alternative MPD)
• Interstitiels personnalisés
• Prise en charge de base de VAST et VMAP sans IMA (lecture sans suivi)

Prise en charge du pilotage de contenu

Shaka Player prend en charge Content Steering (v1) dans DASH et HLS.

Fonctionnalités de pilotage de contenu prises en charge :

• TTL, s'il est manquant, la valeur par défaut est de 300 secondes.
• RELOAD-URI, s'il est manquant, nous utilisons l'URL fournie dans le manifeste comme solution de secours.
• PATHWAY-PRIORITY uniquement remplacement de l'HÔTE

Fonctionnalités de Content Steering non prises en charge :

• PATHWAY-CLONES autres remplacements que HOST.

Prise en charge de la réalité virtuelle

Shaka Player prend en charge la réalité virtuelle lorsque :

• Le contenu est automatiquement traité comme VR s’il répond aux critères suivants :
  • Manifeste HLS ou DASH
  • segments fMP4
  • Le segment d'initialisation contient les boîtes prji et hfov
• Ou, s'il est activé manuellement via la configuration de l'interface utilisateur.

Modes VR pris en charge :

• Projection équirectangulaire avec champ de vision horizontal de 360 ​​degrés.
• Projection Cubemap avec champ de vision horizontal de 360 ​​degrés.

REMARQUES :

• VR n'est pris en charge que pour les flux clairs ou le flux HLS-AES. DRM empêche l'accès aux pixels vidéo pour la transformation.

Documentation et liens importants

• Démo(sources)
• Démo nocturne
• Index de démonstration
• Documentation API
• Tutoriels
• Builds hébergés sur les bibliothèques hébergées par Google
• Builds hébergés sur jsDelivr
• Feuille de route de développement
• Liste d'annonces (rejoignez-nous pour des annonces et des enquêtes peu fréquentes)
• Abonnez-vous aux versions en suivant les instructions de ce blog

FAQ

Pour une aide générale et avant de signaler des bogues, veuillez lire la FAQ.

Contribuer

Si vous avez des améliorations ou des correctifs, nous serions ravis d’avoir vos contributions. Veuillez lire CONTRIBUTING.md pour plus d'informations sur le processus que nous aimerions que les contributeurs suivent.

Intégrations de framework

L'équipe Shaka n'a pas la bande passante et l'expérience nécessaires pour fournir des conseils et une assistance pour l'intégration de Shaka Player avec des frameworks spécifiques, mais certains de nos utilisateurs l'ont fait avec succès et ont créé des tutoriels pour aider d'autres débutants.

Bibliothèque Shaka + ReactJS

• https://github.com/winoffrg/limeplay

Intégrations Shaka + ReactJS :

• https://github.com/matvp91/shaka-player-react
• https://github.com/amit08255/shaka-player-react-with-ui-config

Intégration Shaka + Next.js :

• https://github.com/amit08255/shaka-player-react-with-ui-config/tree/master/nextjs-shaka-player

Intégrations Shaka + Vue.js :

• https://github.com/davidjamesherzog/shaka-player-vuejs

Intégration Shaka + Nuxt.js :

• https://github.com/davidjamesherzog/shaka-player-nuxtjs

Intégration Shaka + video.js :

• https://github.com/davidjamesherzog/videojs-shaka

Shaka + Intégration angulaire :

• https://github.com/PatrickKalkman/shaka-player-angular

Si vous avez publié du code/des didacticiels d'intégration Shaka, n'hésitez pas à soumettre des PR pour les ajouter à cette liste, nous les approuverons avec plaisir !