Amazon Web Services 文档中描述的 Amazon Web Services 服务或功能可能因区域而异。要查看适用于中国区域的差异，请参阅 中国的 Amazon Web Services 服务入门 (PDF)。

本文属于机器翻译版本。若本译文内容与英语原文存在差异，则一律以英文原文为准。

使用 MPEG-DASH 播放视频

要使用 MPEG-DASH 观看 Kinesis 视频流，请先使用 GetDash 网址创建直播会话。StreamingSession此操作将返回用于访问 MPEG-DASH 会话的 URL（包含会话令牌）。您随后可以使用媒体播放器或独立应用程序中的 URL 来显示流。

Amazon Kinesis 视频流在通过 MPEG-DASH 提供视频时需要满足以下要求：

示例：在 HTML 中使用 MPEG-DASH 和 JavaScript

以下示例说明如何检索 Kinesis 视频流的 MPEG-DASH 直播会话并在网页中播放。该示例演示了如何在以下播放器中播放视频：

设置 Kinesis Video Streams 客户端以便播放 MPEG-DASH

要使用 MPEG-DASH 访问流媒体视频，请先创建并配置 Kinesis Video Streams 客户端（用于检索服务端点）和存档媒体客户端（用于检索 MPEG-DASH 直播会话）。该应用程序将从 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);

检索 Kinesis Video Streams 存档内容端点以便播放 MPEG-DASH

启动客户端后，检索 Kinesis Video Streams 存档内容端点，以便您可以按如下方式检索 MPEG-DASH 直播会话网址：

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

检索 MPEG-DASH 流会话 URL

当您拥有存档内容端点后，请调用 GetDash StreamingSession 网址 API 来检索 MPEG-DASH 直播会话网址，如下所示：

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

通过 MPEG-DASH 播放显示流视频

当您具有 MPEG-DASH 流会话 URL 时，请将其提供到视频播放器。向视频播放器提供 URL 的方法特定于您使用的播放器。

以下代码示例演示如何将流会话 URL 提供给 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');
}

以下代码示例说明如何将流会话 URL 提供给 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');
}

完整示例

您可以在上下载或查看已完成的示例代码 GitHub。