View a markdown version of this page

Reproducción de vídeo con MPEG-DASH - Amazon Kinesis Video Streams

Las traducciones son generadas a través de traducción automática. En caso de conflicto entre la traducción y la version original de inglés, prevalecerá la version en inglés.

Reproducción de vídeo con MPEG-DASH

Para ver una transmisión de vídeo de Kinesis utilizando MPEG-DASH, primero debe crear una sesión de streaming utilizando. GetDASHStreamingSessionURL Esta acción devuelve una URL (que contiene un token de sesión) para acceder a la MPEG-DASH sesión. A continuación, puede utilizar la URL en un reproductor multimedia o en una aplicación independiente para mostrar la transmisión.

Una transmisión de vídeo de Amazon Kinesis tiene los siguientes requisitos para proporcionar vídeo a través de: MPEG-DASH

Ejemplo: si se usa en HTML y MPEG-DASH JavaScript

El siguiente ejemplo muestra cómo recuperar una sesión de MPEG-DASH streaming para una transmisión de vídeo de Kinesis y reproducirla en una página web. El ejemplo muestra cómo reproducir vídeo en los siguientes reproductores:

Configurar el cliente MPEG-DASH de Kinesis Video Streams para la reproducción

Para acceder a la transmisión de vídeo MPEG-DASH, primero cree y configure el cliente de Kinesis Video Streams (para recuperar el punto de conexión del servicio) y el cliente multimedia archivado (para recuperar MPEG-DASH la sesión de streaming). La aplicación recupera los valores necesarios de los cuadros de entrada de la página HTML.

var streamName = $('#streamName').val(); // Step 1: Configure SDK Clients var options = { accessKeyId: $('#accessKeyId').val(), secretAccessKey: $('#secretAccessKey').val(), sessionToken: $('#sessionToken').val() || undefined, region: $('#region').val(), endpoint: $('#endpoint').val() || undefined } var kinesisVideo = new AWS.KinesisVideo(options); var kinesisVideoArchivedContent = new AWS.KinesisVideoArchivedMedia(options);

Recupere el terminal de contenido archivado de Kinesis Video Streams para reproducirlo MPEG-DASH

Una vez iniciados los clientes, recupere el punto final de contenido archivado de Kinesis Video Streams para poder recuperar MPEG-DASH la URL de la sesión de streaming de la siguiente manera:

// Step 2: Get a data endpoint for the stream console.log('Fetching data endpoint'); kinesisVideo.getDataEndpoint({ StreamName: streamName, APIName: "GET_DASH_STREAMING_SESSION_URL" }, function(err, response) { if (err) { return console.error(err); } console.log('Data endpoint: ' + response.DataEndpoint); kinesisVideoArchivedContent.endpoint = new AWS.Endpoint(response.DataEndpoint);

Recupere la URL de la sesión MPEG-DASH de streaming

Cuando tengas el punto final de contenido archivado, llama a la GetDASHStreamingSessionURLAPI para recuperar la URL de la sesión de MPEG-DASH streaming de la siguiente manera:

// Step 3: Get a Streaming Session URL var consoleInfo = 'Fetching ' + protocol + ' Streaming Session URL'; console.log(consoleInfo); if (protocol === 'DASH') { kinesisVideoArchivedContent.getDASHStreamingSessionURL({ StreamName: streamName, PlaybackMode: $('#playbackMode').val(), DASHFragmentSelector: { FragmentSelectorType: $('#fragmentSelectorType').val(), TimestampRange: $('#playbackMode').val() === "LIVE" ? undefined : { StartTimestamp: new Date($('#startTimestamp').val()), EndTimestamp: new Date($('#endTimestamp').val()) } }, DisplayFragmentTimestamp: $('#displayFragmentTimestamp').val(), DisplayFragmentNumber: $('#displayFragmentNumber').val(), MaxManifestFragmentResults: parseInt($('#maxResults').val()), Expires: parseInt($('#expires').val()) }, function(err, response) { if (err) { return console.error(err); } console.log('DASH Streaming Session URL: ' + response.DASHStreamingSessionURL);

Muestra el vídeo en streaming con MPEG-DASH la reproducción

Cuando tenga la URL de la sesión de MPEG-DASH streaming, indíquela al reproductor de vídeo. El método para proporcionar la URL al reproductor de vídeo es específico del reproductor utilizado.

En el siguiente ejemplo de código, se muestra cómo proporcionar la URL de la sesión de streaming a un reproductor Google Shaka:

// Step 4: Give the URL to the video player. //Shaka Player elements <video id="shaka" class="player" controls autoplay></video> <script src="https://cdnjs.cloudflare.com/ajax/libs/shaka-player/2.4.1/shaka-player.compiled.js"> </script> ... var playerName = $('#player').val(); if (playerName === 'Shaka Player') { var playerElement = $('#shaka'); playerElement.show(); var player = new shaka.Player(playerElement[0]); console.log('Created Shaka Player'); player.load(response.DASHStreamingSessionURL).then(function() { console.log('Starting playback'); }); console.log('Set player source'); }

En el siguiente ejemplo de código, se muestra cómo proporcionar la URL de la sesión de streaming a un reproductor dash.js:

<!-- dash.js Player elements --> <video id="dashjs" class="player" controls autoplay=""></video> <script src="https://cdn.dashjs.org/latest/dash.all.min.js"></script> ... var playerElement = $('#dashjs'); playerElement.show(); var player = dashjs.MediaPlayer().create(); console.log('Created DASH.js Player'); player.initialize(document.querySelector('#dashjs'), response.DASHStreamingSessionURL, true); console.log('Starting playback'); console.log('Set player source'); }

Ejemplo completo

Puede descargar o ver el código de ejemplo completo en GitHub.