

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

# 使用 HLS 播放视频
<a name="hls-playback"></a>

[HTTP 直播 (HLS)](https://en.wikipedia.org/wiki/HTTP_Live_Streaming) 是一种基于 HTTP 的行业标准媒体流通信协议。您可以使用 HLS 查看 Kinesis 视频流，用于实时播放或查看存档视频。

您可以使用 HLS 进行实时播放。延迟通常介于 3-5 秒之间，但可能介于 1-10 秒之间，具体取决于用例、玩家和网络条件。你可以使用第三方播放器（如 [Video.js](https://github.com/videojs/video.js/) 或 [Google Shaka Player](https://github.com/google/shaka-player)），通过提供 HLS 流会话 URL 来以编程或手动方式显示视频流。你也可以通过在 [Apple Safari 或 Microsof](https://www.apple.com/safari/) [t Edge](https://www.microsoft.com/en-us/edge) 浏览器的位置栏中输入 HLS 直播会话网址来播放视频。

[要使用 HLS 查看 Kinesis 视频流，请先使用 Get SessionURL 创建直播会话。HLSStreaming](https://docs.amazonaws.cn/kinesisvideostreams/latest/dg/API_reader_GetHLSStreamingSessionURL.html)此操作将返回用于访问 HLS 会话的 URL（包含会话令牌）。您随后可以使用媒体播放器或独立应用程序中的 URL 来显示流。

**重要**  
并非所有发送到 Kinesis Video Streams 的媒体都可以通过 HLS 播放。有关具体[GetHLSStreamingSessionURL](API_reader_GetHLSStreamingSessionURL.md)的上传要求，请参阅。

**Topics**
+ [使用检索 HLS 直播会话网址 Amazon CLI](#retrieve-hls-url)
+ [示例：在 HTML 中使用 HLS 和 JavaScript](#how-hls-ex1)
+ [HLS 问题疑难解答](#how-hls-ex1-ts)

## 使用检索 HLS 直播会话网址 Amazon CLI
<a name="retrieve-hls-url"></a>

以下过程演示如何使用为 Kinesis 视频流生成 HLS 直播会话网址。 Amazon CLI 

有关安装说明，请参阅《[Amazon Command Line Interface 用户指南》](https://docs.amazonaws.cn//cli/latest/userguide/getting-started-install.html#getting-started-install-instructions)。安装完成后， Amazon CLI使用凭据和区域进行[配置](https://docs.amazonaws.cn//cli/latest/userguide/getting-started-quickstart.html#getting-started-quickstart-new)。

或者，打开已 Amazon CLI 安装和配置的 Amazon CloudShell 终端。有关更多信息，请参阅 [Amazon CloudShell 用户指南](https://docs.amazonaws.cn//cloudshell/latest/userguide/welcome.html#how-to-get-started)。

**检索 Kinesis 视频流的 HLS 网址端点。**

1. 在终端中键入以下内容：

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

   您将收到如下所示的回复：

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

1. 向返回的端点发出 HLS 直播会话 URL 请求。

------
#### [ Live ]

   为了进行实时播放，HLS 媒体播放列表会根据最新媒体不断更新。当您在媒体播放器中播放此类会话时，用户界面通常会显示 “**实**时” 通知，没有用于在播放窗口中选择要显示的位置的滑块控件。

   运行此命令时，请确保您正在将媒体上传到此流。

   ```
   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 ]

   对于直播回放，从指定的开始时间开始播放。HLS 媒体播放列表还会在最新媒体可用时不断更新。会话将继续包含新摄取的媒体，直到会话到期或指定的结束时间（以先到者为准）。此模式非常有用，可以从检测到事件时开始播放，并继续直播截至会话创建时尚未摄取的媒体。

   确定开始时间戳。

   在此示例中，我们使用以**秒为单位的 Unix Epoch 时间**。有关[时间戳](https://docs.amazonaws.cn//cli/latest/userguide/cli-usage-parameters-types.html#parameter-type-timestamp)格式的更多信息，请参阅《 Amazon Command Line Interface 用户指南》中的 “时间戳” 部分。

   有关转换工具，请参见 [UnixTime.org](https://unixtime.org/)。
   + **1708471800** 等于 2024 年 **2 月 20 日**下午 3:30:00 GMT-08:00

   在此示例中，我们没有指定结束时间戳，这意味着会话将继续包含新摄取的媒体，直到会话到期。

   在`LIVE_REPLAY`播放模式和指定了 [HLS 片段选择器的](https://docs.amazonaws.cn//kinesisvideostreams/latest/dg/API_reader_GetHLSStreamingSessionURL.html#KinesisVideo-reader_GetHLSStreamingSessionURL-request-HLSFragmentSelector)情况下调用 `GetHLSStreamingSessionURL` API。

   ```
   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 ]

   对于按需播放，HLS 媒体播放列表包含由 HLS 片段选择器指定的媒体。在媒体播放器中播放此类会话时，用户界面通常会显示一个滑块控件，用于在播放窗口中选择要显示的位置。

   要为直播的特定部分创建网址，请先确定开始和结束时间戳。

   在此示例中，我们使用以**秒为单位的 Unix Epoch 时间**。有关[时间戳](https://docs.amazonaws.cn//cli/latest/userguide/cli-usage-parameters-types.html#parameter-type-timestamp)格式的更多信息，请参阅《 Amazon Command Line Interface 用户指南》中的 “时间戳” 部分。

   有关转换工具，请参见 [UnixTime.org](https://unixtime.org/)。
   + **1708471800** 等于 2024 年 **2 月 20 日**下午 3:30:00 GMT-08:00
   + **1708471860** 等于 2024 年 **2 月 20 日**下午 3:31:00 GMT-08:00

   在`ON_DEMAND`播放模式和指定了 [HLS 片段选择器的](https://docs.amazonaws.cn//kinesisvideostreams/latest/dg/API_reader_GetHLSStreamingSessionURL.html#KinesisVideo-reader_GetHLSStreamingSessionURL-request-HLSFragmentSelector)情况下调用 `GetHLSStreamingSessionURL` API。

   ```
   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}}}"
   ```

**注意**  
如文档中所述，时间戳必须在 24 小时之内。[HLSTimestampRange](API_reader_HLSTimestampRange.md)

------

   您将收到如下所示的回复：

   ```
   {
       "HLSStreamingSessionURL": "https://b-{{1234abcd}}.kinesisvideo.{{aws-region}}.amazonaws.com/hls/v1/getHLSMasterPlaylist.m3u8?SessionToken={{CiAz...DkRE6M}}~"
   }
   ```
**重要**  
请勿将此令牌共享或存储在未经授权的实体可以访问的地方。该令牌提供对直播内容的访问权限。使用与 Amazon 凭证相同的措施来保护令牌。

   您可以使用此网址和任何 HLS 播放器来观看 HLS 直播。

   例如，使用 VLC 媒体播放器。

   你也可以通过在 Apple Safari 或 Microsoft Edge 浏览器的位置栏中输入 HLS 直播会话网址来播放 HLS 直播。

## 示例：在 HTML 中使用 HLS 和 JavaScript
<a name="how-hls-ex1"></a>

以下示例说明如何使用 Amazon 适用于 JavaScript v2 的软件开发工具包检索 Kinesis 视频流的 HLS 直播会话并在网页中播放。该示例演示了如何在以下播放器中播放视频：
+ [Video.js](https://github.com/videojs/video.js/) 
+ [Google Shaka Player](https://github.com/google/shaka-player)
+ [hls.js](https://github.com/video-dev/hls.js/)

在中查看[完整的示例代码](https://github.com/aws-samples/amazon-kinesis-video-streams-media-viewer)和[托管网页](https://aws-samples.github.io/amazon-kinesis-video-streams-media-viewer/) GitHub。这个静态网页简化了对来自亚马逊 Kinesis 视频流的 HLS 和 MPEG-DASH 输出的测试和实验。示例页面提供了以下参数的输入字段：
+ Amazon Web Services 区域: 您的 Kinesis 视频流所在的区域
+ 直播名称：你的 Kinesis 视频直播的名称
+ 播放模式：HLS 播放模式（直播、LIVE\_REPLAY 或 ON\_DEMAND）
+ 片段选择器类型：用于选择片段的方法（SERVER\_TIMESTAMP 或 PRODUCER\_TIMESTAMP）
+ 片段编号：起始片段号（如果适用）
+ 容器格式：媒体容器的格式（FRAGMENTED\_ MP4 或 MPEG\_TS）

应用程序从 HTML 页面的输入框中检索这些值，并使用它们来构造页面上显示的 HLS 流式传输会话的请求。

**Topics**
+ [导入 JavaScript 适用于浏览器的 Amazon SDK](#how-hls-ex1-import)
+ [设置 Kinesis Video Streams 客户端](#how-hls-ex1-setup)
+ [检索 HLS 播放的端点](#how-hls-ex1-endpoint)
+ [设置 Kinesis Video Streams 存档媒体客户端](#how-hls-ex1-session)
+ [检索 HLS 直播会话网址](#how-hls-ex1-retrieve-url)
+ [在网页上显示 HLS 直播](#how-hls-ex1-display)

### 导入 JavaScript 适用于浏览器的 Amazon SDK
<a name="how-hls-ex1-import"></a>

在网页中，添加以下脚本标签以将 JavaScript v2 版 Amazon SDK 导入到项目中。

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

有关更多信息，请参阅 S [Amazon DK](https://docs.amazonaws.cn//sdk-for-javascript/v2/developer-guide/loading-the-jssdk.html) 中的 JavaScript文档。

### 设置 Kinesis Video Streams 客户端
<a name="how-hls-ex1-setup"></a>

要使用 HLS 访问流媒体视频，请先创建和配置 Kinesis Video Streams 客户端。有关其他身份验证方法[，请参阅在 Web 浏览器中设置凭据](https://docs.amazonaws.cn//sdk-for-javascript/v2/developer-guide/setting-credentials-browser.html)。

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

该应用程序将从 HTML 页面上的输入框检索必要值。

### 检索 HLS 播放的端点
<a name="how-hls-ex1-endpoint"></a>

使用 Kinesis Video Streams 客户端调用 [GetDataEndpoint](API_GetDataEndpoint.md) API 来检索端点。

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

此代码将端点存储在`hlsDataEndpoint`变量中。

### 设置 Kinesis Video Streams 存档媒体客户端
<a name="how-hls-ex1-session"></a>

在 Kinesis Video Streams 存档媒体客户端的客户端配置中，指定您在上一步中获得的终端节点。

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

### 检索 HLS 直播会话网址
<a name="how-hls-ex1-retrieve-url"></a>

使用 Kinesis Video Streams 存档媒体客户端调用 [GetHLSStreamingSessionURL](API_reader_GetHLSStreamingSessionURL.md) API 来检索 HLS 播放网址。

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

### 在网页上显示 HLS 直播
<a name="how-hls-ex1-display"></a>

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

------
#### [ Video.js ]

执行以下操作[将 Video.js](https://github.com/videojs/video.js/) 及其 CSS 类导入到我们的浏览器脚本中：

```
<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>
```

创建一个 `video` HTML 元素来显示视频：

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

将 HLS 网址设置为 HTML 视频元素的来源：

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

------
#### [ Shaka ]

执行以下操作将 [Google Shaka 播放器](https://github.com/shaka-project/shaka-player)导入我们的浏览器脚本：

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

创建一个 `video` HTML 元素来显示视频：

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

创建一个指定视频元素的 Shaka 播放器并调用 load 方法：

```
const playerElement = document.getElementById('shaka');
const player = new shaka.Player(playerElement);
player.load({{hlsUrl}});
```

------
#### [ hls.js ]

执行以下操作将 [hls.js](https://github.com/video-dev/hls.js/) 导入我们的浏览器脚本：

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

创建一个 `video` HTML 元素来显示视频：

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

创建一个 hls.js 播放器，给它一个 HLS 网址，然后叫它玩：

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

------

## HLS 问题疑难解答
<a name="how-hls-ex1-ts"></a>

本节介绍在 Kinesis Video Streams 中使用 HTTP 直播 (HLS) 时可能遇到的问题。

**Topics**
+ [检索 HLS 流会话 URL 成功，但在视频播放器中播放失败](#troubleshooting-hls-playback)
+ [创建者与播放器之间的延迟过高](#troubleshooting-hls-latency)

### 检索 HLS 流会话 URL 成功，但在视频播放器中播放失败
<a name="troubleshooting-hls-playback"></a>

当使用 `GetHLSStreamingSessionURL` 可以成功检索 HLS 流会话 URL，但将该 URL 提供给视频播放器后视频无法播放时，就会出现这种情况。

要排查这种情况，请尝试以下操作：
+ 确定视频流是否在 Kinesis Video Streams 控制台中播放。考虑控制台显示的任何错误。
+ 如果片段持续时间少于 1 秒，则增加到 1 秒。如果片段持续时间太短，则该服务可能会限制播放器，因为它过于频繁地请求视频片段。
+ 验证每个 HLS 流会话 URL 是否在被唯一的用户使用。如果多个播放器正在使用单个 HLS 流会话 URL，服务可能会收到过多的请求并限制这些播放器。
+ 确认您的播放器支持您为 HLS 直播会话指定的所有选项。为以下参数尝试其他值组合：
  + `ContainerFormat`
  + `PlaybackMode`
  + `FragmentSelectorType`
  + `DiscontinuityMode`
  + `MaxMediaPlaylistFragmentResults`

  某些媒体播放器（例如 HTML5 和移动播放器）通常仅支持 f MP4 容器格式的 HLS。其他媒体播放器（例如 Flash 和自定义播放器）可能只支持 MPEG TS 容器格式的 HLS。我们建议尝试使用`ContainerFormat`参数来开始故障排除。
+ 验证每个片段是否具有一致的轨道数。验证流中的片段在同时具有音频和视频轨道与只有视频轨道之间没有变化。另外，请确认每个轨道的片段之间的编码器设置（分辨率和帧速率）没有变化。

### 创建者与播放器之间的延迟过高
<a name="troubleshooting-hls-latency"></a>

当捕获视频与在视频播放器中播放视频之间的延迟过高时，就会出现这种情况。

视频通过 HLS 逐个片段地播放。因此，延迟不能小于片段持续时间。延迟还包含缓冲和传输数据所需的时间。如果您的解决方案需要的延迟不到一秒，请考虑改用 `GetMedia` API。

您可以调整以下参数来减少总体延迟，但调整这些参数也可能降低视频质量或提高再缓冲率。
+ **片段持续时间**-片段持续时间是视频流中各分段之间的视频量，由视频编码器生成的关键帧频率控制。推荐值为 1 秒。具有较短的片段持续时间意味着在将视频数据传输到服务之前等待片段完成的时间会更少。较短的片段还有助于提高服务的处理速度。但是，如果片段持续时间过短，则可能增加播放器耗尽内容且必须停止和缓冲内容的可能性。如果片段持续时间短于 500 毫秒，创建者可能会创建过多请求，从而导致服务对其进行限制。
+ **比特率** — 比特率较低的视频流读取、写入和传输所需的时间更少。但是，比特率较低的视频流通常具有较低的视频质量。
+ **媒体播放列表中的片段数** — 对延迟敏感的播放器只能加载媒体播放列表中的最新片段。大多数玩家改为从最早的片段开始。通过减少播放列表中的片段数量，可以缩短先前片段和新片段之间的时间间隔。如果播放列表大小较小，则在向播放列表添加新片段时出现延迟，或者如果玩家获取更新的播放列表出现延迟，则在播放过程中可能会跳过片段。我们建议使用 3—5 个片段，并使用配置为仅加载播放列表中最新片段的播放器。
+ **播放器缓冲区大小** — 大多数视频播放器都有可配置的最小缓冲持续时间，默认值通常为 10 秒。要最大程度地减少延迟，您可以将此值设置为 0 秒。但是，这样做意味着如果有任何延迟生成片段，则玩家会拒绝缓冲，因为玩家没有缓冲区来吸收延迟。
+ **播放器 “catch up”** — 如果缓冲区已满，视频播放器通常不会自动将播放捕捉到视频缓冲区前面，比如延迟的片段导致片段积压播放。自定义播放器可通过删除帧或提高播放速度（例如，提高到 1.1 倍）以赶到缓冲区的前面来避免这一点。这会导致播放器赶上时出现震荡或加速，并且由于缓冲区大小被保持在较小水平，重新缓冲可能会更频繁。