Lecture vidéo avec HLS - Amazon Kinesis Video Streams
Utilisez le AWS CLI pour récupérer une session de HLS streaming URLExemple : utilisation HLS dans HTML et JavaScriptHLSProblèmes de résolution des problèmes

Les traductions sont fournies par des outils de traduction automatique. En cas de conflit entre le contenu d'une traduction et celui de la version originale en anglais, la version anglaise prévaudra.

Lecture vidéo avec HLS

HTTPLive Streaming (HLS) est un protocole de communication en streaming multimédia HTTP basé sur les normes du secteur. Vous pouvez l'utiliser HLS pour visionner un flux vidéo Kinesis, soit pour le visionner en direct, soit pour visionner une vidéo archivée.

Vous pouvez l'utiliser HLS pour la diffusion en direct. La latence est généralement comprise entre 3 et 5 secondes, mais elle peut être comprise entre 1 et 10 secondes, selon le cas d'utilisation, le lecteur et les conditions du réseau. Vous pouvez utiliser un lecteur tiers (tel que Video.js ou Google Shaka Player) pour afficher le flux vidéo en fournissant la session de HLS streamingURL, par programmation ou manuellement. Vous pouvez également lire une vidéo en accédant à la session de HLS streaming URL dans la barre d'adresse des navigateurs Apple Safari ou Microsoft Edge.

Pour visionner un flux vidéo Kinesis à l'aide de G etHLSStreaming SessionHLS, créez d'abord une session de diffusion en continu. URL Cette action renvoie un URL (contenant un jeton de session) pour accéder à la HLS session. Vous pouvez ensuite l'utiliser URL dans un lecteur multimédia ou une application autonome pour afficher le flux.

Important

Les médias envoyés à Kinesis Video Streams ne peuvent pas tous être lus. HLS Consultez GetHLSStreamingSessionURL les exigences spécifiques en matière de téléchargement.

Utilisez le AWS CLI pour récupérer une session de HLS streaming URL

Suivez la procédure ci-dessous AWS CLI pour générer une session de HLS streaming URL pour un flux vidéo Kinesis.

Pour les instructions d'installation, consultez le guide de AWS Command Line Interface l'utilisateur. Après l'installation, configurez le AWS CLI avec les informations d'identification et la région.

Vous pouvez également ouvrir le AWS CloudShell terminal sur lequel ils AWS CLI sont installés et configurés. Pour plus d'informations, consultez le Guide de l'utilisateur AWS CloudShell.

Récupérez le HLS URL point de terminaison pour votre flux vidéo Kinesis.

  1. Tapez ce qui suit dans le terminal :

    aws kinesisvideo get-data-endpoint \
  --api-name GET_HLS_STREAMING_SESSION_URL \
  --stream-name YourStreamName

    Vous recevrez une réponse qui ressemble à ceci :

    {
    "DataEndpoint": "https://b-1234abcd.kinesisvideo.aws-region.amazonaws.com"
}

  2. Envoyez la URL demande de session de HLS streaming à ce point de terminaison renvoyé.

    Live

    Pour la lecture en direct, la liste de lecture HLS multimédia est continuellement mise à jour avec les derniers médias dès qu'ils sont disponibles. Lorsque vous jouez ce type de session dans un lecteur multimédia, l'interface utilisateur affiche généralement une notification « en direct », sans aucune commande permettant de choisir la position à afficher dans la fenêtre de lecture.

    Assurez-vous que vous téléchargez du contenu multimédia sur ce flux lorsque vous exécutez cette commande. 

    aws kinesis-video-archived-media get-hls-streaming-session-url \
  --endpoint-url https://b-1234abcd.kinesisvideo.aws-region.amazonaws.com \
  --stream-name YourStreamName \
  --playback-mode LIVE
    Live replay

    Pour la rediffusion en direct, la lecture commence à partir d'une heure de début spécifiée. La liste de lecture HLS multimédia est également continuellement mise à jour avec les derniers médias dès qu'ils sont disponibles. La session continuera à inclure les médias nouvellement ingérés jusqu'à son expiration ou jusqu'à l'heure de fin spécifiée, selon la première éventualité. Ce mode est utile pour démarrer la lecture dès qu'un événement est détecté et continuer à diffuser en direct du contenu multimédia qui n'a pas encore été ingéré au moment de la création de la session.

    Déterminez un horodatage de début.

    Pour cet exemple, nous utilisons le format Unix Epoch en secondes. Reportez-vous à la section Horodatages du guide de l' AWS Command Line Interface utilisateur pour plus d'informations sur le formatage des horodatages.

    Voir UnixTime.org pour un outil de conversion.

    • 1708471800 est égal au 20 février 2024 de 15 h 30 à 20 h 00 GMT

    Dans cet exemple, nous ne spécifions pas d'horodatage de fin, ce qui signifie que la session continuera à inclure le contenu multimédia récemment ingéré jusqu'à son expiration.

    Appelez le mode LIVE_REPLAY de lecture GetHLSStreamingSessionURL API avec un sélecteur de HLS fragments spécifié.

    aws kinesis-video-archived-media get-hls-streaming-session-url \
  --endpoint-url https://b-1234abcd.kinesisvideo.aws-region.amazonaws.com \
  --stream-name YourStreamName \
  --playback-mode LIVE_REPLAY \
  --hls-fragment-selector \
    "FragmentSelectorType=SERVER_TIMESTAMP,TimestampRange={StartTimestamp=1708471800}"
    On-demand

    Pour la lecture à la demande, la liste de lecture HLS multimédia contient le contenu multimédia spécifié par le sélecteur de HLS fragments. Lorsque ce type de session est lu dans un lecteur multimédia, l'interface utilisateur affiche généralement une commande de nettoyage permettant de choisir la position à afficher dans la fenêtre de lecture.

    Pour créer un URL pour une certaine section du flux, déterminez d'abord les horodatages de début et de fin.

    Pour cet exemple, nous utilisons le format Unix Epoch en secondes. Reportez-vous à la section Horodatages du guide de l' AWS Command Line Interface utilisateur pour plus d'informations sur le formatage des horodatages.

    Voir UnixTime.org pour un outil de conversion.

    • 1708471800 est égal au 20 février 2024 de 15 h 30 à 20 h 00 GMT

    • 1708471860 est égal au 20 février 2024 15:31:00 PM - 20:00 GMT

    Appelez le mode ON_DEMAND de lecture GetHLSStreamingSessionURL API avec un sélecteur de HLS fragments spécifié.

    aws kinesis-video-archived-media get-hls-streaming-session-url \
  --endpoint-url https://b-1234abcd.kinesisvideo.aws-region.amazonaws.com \
  --stream-name YourStreamName \
  --playback-mode ON_DEMAND \
  --hls-fragment-selector \
    "FragmentSelectorType=SERVER_TIMESTAMP,TimestampRange={StartTimestamp=1708471800,EndTimestamp=1708471860}"
    Note

    Les horodatages doivent être espacés de 24 heures l'un de l'autre, comme indiqué dans la documentation. HLSTimestampRange

    Vous recevrez une réponse qui ressemble à ceci :

    {
    "HLSStreamingSessionURL": "https://b-1234abcd.kinesisvideo.aws-region.amazonaws.com/hls/v1/getHLSMasterPlaylist.m3u8?SessionToken=CiAz...DkRE6M~"
}
    Important

    Ne partagez pas et ne stockez pas ce jeton dans un endroit où une entité non autorisée pourrait y accéder. Le jeton donne accès au contenu du flux. Protégez le jeton avec les mêmes mesures que celles que vous utiliseriez avec vos AWS informations d'identification.

    Vous pouvez l'utiliser, URL ainsi que n'importe quel HLS joueur, pour visionner le HLS stream.

    Par exemple, utilisez un lecteur VLC multimédia.

    Vous pouvez également écouter le HLS Stream en accédant à la session de HLS streaming URL dans la barre d'adresse des navigateurs Apple Safari ou Microsoft Edge.

Exemple : utilisation HLS dans HTML et JavaScript

L'exemple suivant montre comment utiliser le AWS SDK for JavaScript v2 pour récupérer une session de HLS streaming pour un flux vidéo Kinesis et la lire sur une page Web. Cet exemple montre comment lire la vidéo dans les lecteurs suivants :

Consultez l'exemple de code complet et la page Web hébergée dans GitHub.

Importer le AWS SDK formulaire JavaScript pour les navigateurs

Dans la page Web, incluez la balise de script suivante pour importer le AWS SDK for JavaScript v2 dans le projet.

<script src="https://cdnjs.cloudflare.com/ajax/libs/aws-sdk/2.490.0/aws-sdk.min.js"></script>

Pour plus d'informations, reportez-vous à AWS SDKla JavaScript documentation.

Configuration du client Kinesis Video Streams

Pour accéder à une vidéo en streaming avecHLS, créez et configurez d'abord le client Kinesis Video Streams. Voir Configuration des informations d'identification dans un navigateur Web pour d'autres méthodes d'authentification.

const clientConfig = {
    accessKeyId: 'YourAccessKey',
    secretAccessKey: 'YourSecretKey',
    region: 'us-west-2'
};
const kinesisVideoClient = new AWS.KinesisVideo(clientConfig);

L'application récupère les valeurs nécessaires dans les zones de saisie de la HTML page.

Récupérez le point de terminaison pour le HLS lire

Utilisez le client Kinesis Video Streams pour appeler le afin de récupérer GetDataEndpoint API le point de terminaison.

const getDataEndpointOptions = {
    StreamName: 'YourStreamName',
    APIName: 'GET_HLS_STREAMING_SESSION_URL'
};
const getDataEndpointResponse = await kinesisVideoClient
    .getDataEndpoint(getDataEndpointOptions)
    .promise();
const hlsDataEndpoint = getDataEndpointResponse.DataEndpoint;

Ce code stocke le point de terminaison dans la hlsDataEndpoint variable.

Configuration du client multimédia archivé Kinesis Video Streams

Dans la configuration du client multimédia archivé Kinesis Video Streams, spécifiez le point de terminaison que vous avez obtenu à l'étape précédente.

const archivedMediaClientConfig = {
    accessKeyId: 'YourAccessKey',
    secretAccessKey: 'YourSecretKey',
    region: 'us-west-2',
    endpoint: hlsDataEndpoint
};
const kinesisVideoArchivedMediaClient = new AWS.KinesisVideoArchivedMedia(archivedMediaClientConfig);

Récupérez la session de HLS streaming URL

Utilisez le client multimédia archivé Kinesis Video Streams pour appeler GetHLSStreamingSessionURL API le afin de récupérer HLS la URL lecture.

const getHLSStreamingSessionURLOptions = {
    StreamName: 'YourStreamName',
    PlaybackMode: 'LIVE'
};
const getHLSStreamingSessionURLResponse = await kinesisVideoArchivedMediaClient
    .getHLSStreamingSessionURL(getHLSStreamingSessionURLOptions)
    .promise();
const hlsUrl = getHLSStreamingSessionURLResponse.HLSStreamingSessionURL;

Afficher le HLS flux sur la page Web

Lorsque vous avez une session de HLS streamingURL, transmettez-la au lecteur vidéo. La méthode de mise URL à disposition du lecteur vidéo est spécifique au lecteur utilisé.

Video.js

Procédez comme suit pour importer Video.js et ses CSS classes dans le script de votre navigateur :

<link rel="stylesheet" href="https://vjs.zencdn.net/6.6.3/video-js.css">
<script src="https://vjs.zencdn.net/6.6.3/video.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/videojs-contrib-hls/5.14.1/videojs-contrib-hls.js"></script>

Créez un video HTML élément pour afficher la vidéo :

<video id="videojs" class="player video-js vjs-default-skin" controls autoplay></video>

Définissez le HLS URL comme source de l'élément HTML vidéo :

const playerElement = document.getElementById('videojs');
const player = videojs(playerElement);
player.src({
    src: hlsUrl,
    type: 'application/x-mpegURL'
});
player.play();
Shaka

Procédez comme suit pour importer le lecteur Google Shaka dans le script de notre navigateur :

<script src="https://cdnjs.cloudflare.com/ajax/libs/shaka-player/2.4.1/shaka-player.compiled.js"></script>

Créez un video HTML élément pour afficher la vidéo :

<video id="shaka" class="player" controls autoplay></video>

Créez un lecteur Shaka en spécifiant l'élément vidéo et appelez la méthode de chargement :

const playerElement = document.getElementById('shaka');
const player = new shaka.Player(playerElement);
player.load(hlsUrl);
hls.js

Procédez comme suit pour importer le fichier hls.js dans le script de votre navigateur :

<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>

Créez un video HTML élément pour afficher la vidéo :

<video id="hlsjs" class="player" controls autoplay></video>

Créez un lecteur hls.js, donnez-lui HLS URL le et dites-lui de jouer :

const playerElement = document.getElementById('hlsjs');
const player = new Hls();
player.loadSource(hlsUrl);
player.attachMedia(playerElement);
player.on(Hls.Events.MANIFEST_PARSED, function() {
    video.play();
});

HLSProblèmes de résolution des problèmes

Cette section décrit les problèmes que vous pouvez rencontrer lors de l'utilisation de HTTP Live Streaming (HLS) avec Kinesis Video Streams.

La récupération de la session de HLS streaming URL réussit, mais la lecture échoue dans le lecteur vidéo

Cette situation se produit lorsque vous parvenez à récupérer une session de HLS streaming à URL l'aide deGetHLSStreamingSessionURL, mais que la vidéo ne parvient pas à être lue lorsqu'elle URL est fournie à un lecteur vidéo.

Pour résoudre ce problème, essayez l'une des actions suivantes :

  • Déterminez si le flux vidéo est lu dans la console Kinesis Video Streams. Prenez en compte toutes les erreurs que la console affiche.

  • Si la durée de fragment est inférieure à une seconde, augmentez-la à une seconde. Si la durée du fragment est trop courte, le service peut ralentir le lecteur car il demande trop fréquemment des fragments vidéo.

  • Vérifiez que chaque session de HLS streaming URL est utilisée par un seul joueur. Si plusieurs joueurs utilisent une même session de HLS streamingURL, le service risque de recevoir trop de demandes et de les limiter.

  • Vérifiez que votre lecteur prend en charge toutes les options que vous spécifiez pour la session de HLS streaming. Essayez des combinaisons différentes de valeurs pour les paramètres suivants :

    • ContainerFormat

    • PlaybackMode

    • FragmentSelectorType

    • DiscontinuityMode

    • MaxMediaPlaylistFragmentResults

    Certains lecteurs multimédias (tels que HTML5 les lecteurs mobiles) ne sont généralement compatibles qu'HLSavec le format de MP4 conteneur f. Les autres lecteurs multimédias (tels que Flash et les lecteurs personnalisés) ne sont peut-être compatibles qu'HLSavec le format conteneur MPEG TS. Nous vous recommandons de tester le ContainerFormat paramètre pour commencer à résoudre les problèmes.

  • Vérifiez que chaque fragment possède un nombre de pistes cohérent. Vérifiez que les fragments du flux ne changent pas entre une piste audio et vidéo et une piste vidéo uniquement. Vérifiez également que les paramètres de l'encodeur (résolution et fréquence d'images) ne changent pas entre les fragments de chaque piste.

Latence trop élevée entre producteur et lecteur

Cette situation se produit lorsque la latence est trop élevée entre le moment où la vidéo est capturée et le moment où elle est lue dans le lecteur vidéo.

La vidéo est lue HLS fragment par fragment. Par conséquent, la latence ne peut pas être inférieure à la durée du fragment. La latence inclut également le temps nécessaire à la mise en tampon et au transfert des données. Si votre solution nécessite une latence inférieure à une seconde, pensez à l'utiliser à la GetMedia API place.

Les paramètres suivants peuvent être ajustés pour réduire la latence globale, mais l'ajustement de ces paramètres peut également réduire la qualité de la vidéo ou augmenter le taux de remise en tampon.

  • Durée du fragment : la durée du fragment est la quantité de vidéo entre les divisions du flux, contrôlée par la fréquence des images-clés générées par l'encodeur vidéo. La valeur recommandée est d'une seconde. Le fait d'avoir une durée de fragment plus courte signifie que moins de temps s'écoule à attendre la fin du fragment avant de transmettre les données vidéo au service. Les fragments plus courts sont également plus rapides à traiter par le service. Toutefois, si la durée de fragment est trop courte, la probabilité augmente que le lecteur viendra à manquer de contenu et devra s'arrêter et mettre en tampon du contenu. Si la durée de fragment est inférieure à 500 millisecondes, le producteur peut créer un trop grand nombre de demandes, obligeant ainsi le service à les limiter.

  • Débit — Un flux vidéo avec un débit inférieur prend moins de temps à lire, à écrire et à transmettre. Toutefois, un flux vidéo avec une vitesse de transmission plus faible a généralement une plus faible qualité vidéo.

  • Nombre de fragments dans les listes de lecture multimédia : un lecteur sensible à la latence ne doit charger que les fragments les plus récents d'une liste de lecture multimédia. La plupart des joueurs commencent plutôt par le premier fragment. En réduisant le nombre de fragments dans la playlist, vous réduisez l'intervalle de temps entre les fragments précédents et les nouveaux fragments. Avec une taille de playlist plus petite, il est possible qu'un fragment soit ignoré pendant la lecture si l'ajout de nouveaux fragments à la liste de lecture est retardé ou si le lecteur tarde à obtenir une liste de lecture mise à jour. Nous vous recommandons d'utiliser 3 à 5 fragments et d'utiliser un lecteur configuré pour charger uniquement les derniers fragments d'une playlist.

  • Taille de la mémoire tampon du lecteur — La plupart des lecteurs vidéo ont une durée de mémoire tampon minimale configurable, généralement de 10 secondes par défaut. Pour la latence la plus faible, vous pouvez définir cette valeur sur 0 seconde. Cependant, cela signifie que le joueur rebuffera en cas de retard de production de fragments, car le joueur n'aura pas de mémoire tampon pour absorber le retard.

  • Lecteur « catch up » : les lecteurs vidéo ne reprennent généralement pas automatiquement la lecture jusqu'au début de la mémoire tampon lorsque celle-ci est pleine, par exemple lorsqu'un fragment retardé entraîne un retard de lecture de fragments. Un lecteur personnalisé peut éviter ce problème en supprimant des trames ou en augmentant la vitesse de lecture (par exemple, à 1,1x) pour rattraper l'avant du tampon. Cela entraîne des saccades ou des accélérations de la lecture lorsque le lecteur rattrape son retard, et une remise en tampon peut être plus fréquente lorsque la taille du tampon est maintenue courte.