Die vorliegende Übersetzung wurde maschinell erstellt. Im Falle eines Konflikts oder eines Widerspruchs zwischen dieser übersetzten Fassung und der englischen Fassung (einschließlich infolge von Verzögerungen bei der Übersetzung) ist die englische Fassung maßgeblich.

Videowiedergabe mit MPEG-DASH

Um einen Kinesis-Videostream mit anzusehen MPEG-DASH, erstellen Sie zunächst eine Streaming-Sitzung mit GetDASHStreamingSessionURL. Diese Aktion gibt eine URL (die ein Sitzungstoken enthält) für den Zugriff auf die MPEG-DASH Sitzung zurück. Anschließend können Sie die URL in einen Media Player oder einer eigenständigen Anwendung zum Anzeigen des Streams verwenden.

Für einen Amazon Kinesis Kinesis-Videostream gelten die folgenden Anforderungen für die Bereitstellung von Video über MPEG-DASH:

Beispiel: Verwendung in HTML und MPEG-DASH JavaScript

Das folgende Beispiel zeigt, wie eine MPEG-DASH Streaming-Sitzung für einen Kinesis-Videostream abgerufen und auf einer Webseite wiedergegeben wird. Das Beispiel veranschaulicht die Wiedergabe von Videos in den folgenden Playern:

Den Kinesis Video Streams Streams-Client für die MPEG-DASH Wiedergabe einrichten

Um auf Streaming-Video zuzugreifen MPEG-DASH, müssen Sie zunächst den Kinesis Video Streams Streams-Client (zum Abrufen des Service-Endpunkts) und den archivierten Medienclient (zum Abrufen der MPEG-DASH Streaming-Sitzung) erstellen und konfigurieren. Die Anwendung ruft die erforderlichen Werte aus Eingabefeldern auf der HTML-Seite ab.

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);

Rufen Sie den Endpunkt für archivierte Inhalte von Kinesis Video Streams zur MPEG-DASH Wiedergabe ab

Rufen Sie nach der Initiierung der Clients den Endpunkt für archivierte Inhalte von Kinesis Video Streams ab, sodass Sie die URL der MPEG-DASH Streaming-Sitzung wie folgt abrufen können:

 // 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);

Rufen Sie die URL der MPEG-DASH Streaming-Sitzung ab

Wenn Sie den Endpunkt für archivierte Inhalte haben, rufen Sie die GetDASHStreamingSessionURLAPI auf, um die URL der MPEG-DASH Streaming-Sitzung wie folgt abzurufen:

// 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);
                

Zeigen Sie das Streaming-Video mit MPEG-DASH Wiedergabe an

Wenn Sie die URL der MPEG-DASH Streaming-Sitzung haben, stellen Sie sie dem Videoplayer zur Verfügung. Die Methode, mit der die URL für den Video-Player bereitgestellt wird, ist vom jeweils verwendeten Player abhängig.

Das folgende Codebeispiel veranschaulicht, wie die Streaming-Sitzungs-URL für einen Google Shaka-Player bereitgestellt wird:

// 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');
}

Das folgende Codebeispiel veranschaulicht, wie die Streaming-Sitzungs-URL für einen dash.js-Player bereitgestellt wird:

<!-- 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');
}

Beispiel abgeschlossen

Sie können den fertigen Beispielcode unter herunterladen oder ansehen GitHub.