使用 播放影片 HLS - Amazon Kinesis Video Streams

本文為英文版的機器翻譯版本,如內容有任何歧義或不一致之處,概以英文版為準。

使用 播放影片 HLS

HTTP Live Streaming (HLS) 是業界標準的 HTTP型媒體串流通訊協定。您可以使用 HLS來檢視 Kinesis 影片串流,無論是即時播放或檢視封存的影片。

您可以使用 HLS 進行即時播放。延遲通常介於 3–5 秒之間,但也可能介於 1–10 秒之間,取決於使用案例、玩家和網路條件。您可以使用第三方播放器 (例如 Video.jsGoogle Shaka Player)URL,以程式設計方式或手動方式提供HLS串流工作階段 來顯示影片串流。您也可以URL在 Apple SafariMicrosoft Edge 瀏覽器的位置列中輸入HLS串流工作階段來播放影片。

若要使用 檢視 Kinesis 影片串流HLS,請先使用 G Session 建立串流etHLSStreaming工作階段URL。此動作會傳回用於存取工作階段的 URL(包含HLS工作階段權杖)。然後,您可以在URL媒體播放器或獨立應用程式中使用 來顯示串流。

重要

並非所有傳送到 Kinesis Video Streams 的媒體都可以透過 播放HLS。如需特定上傳需求GetHLSStreamingSessionURL,請參閱 。

使用 AWS CLI 擷取HLS串流工作階段 URL

請依照下列程序使用 AWS CLI 來產生 Kinesis 影片串流URL的HLS串流工作階段。

如需安裝說明,請參閱 AWS Command Line Interface 使用者指南。安裝後,使用登入資料和區域設定 AWS CLI

或者,開啟已安裝 AWS CLI 並設定 的 AWS CloudShell 終端機。如需詳細資訊,請參閱 AWS CloudShell 使用者指南

擷取 Kinesis 影片串流的HLSURL端點。
  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" }
  2. 向傳回的端點提出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 時間。如需時間戳記格式的詳細資訊,請參閱 AWS Command Line Interface 使用者指南中的時間戳記一節。

    如需轉換工具,請參閱 UnixTime.org

    • 1708471800 等於 2024 年 2 月 20 日下午 3:30:00 GMT- 08:00

    在此範例中,我們不會指定結束時間戳記,這表示工作階段會繼續包含新擷取的媒體,直到工作階段過期為止。

    GetHLSStreamingSessionURL API 使用LIVE_REPLAY播放模式和指定的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_REPLAY \ --hls-fragment-selector \ "FragmentSelectorType=SERVER_TIMESTAMP,TimestampRange={StartTimestamp=1708471800}"
    On-demand

    對於隨需播放,HLS媒體播放清單包含HLS片段選擇器指定的媒體。在媒體播放器中播放此類型的工作階段時,使用者介面通常會顯示清除器控制項,以選擇要顯示之播放視窗中的位置。

    若要URL為串流的特定區段建立 ,請先判斷開始和結束時間戳記。

    在此範例中,我們使用秒格式的 Unix Epoch 時間。如需時間戳記格式的詳細資訊,請參閱 AWS Command Line Interface 使用者指南中的時間戳記一節。

    如需轉換工具,請參閱 UnixTime.org

    • 1708471800 等於 2024 年 2 月 20 日下午 3:30:00 GMT- 08:00

    • 1708471860 等於 2024 年 2 月 20 日下午 3:31:00 GMT- 08:00

    GetHLSStreamingSessionURL API 使用ON_DEMAND播放模式和指定的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 ON_DEMAND \ --hls-fragment-selector \ "FragmentSelectorType=SERVER_TIMESTAMP,TimestampRange={StartTimestamp=1708471800,EndTimestamp=1708471860}"
    注意

    時間戳記必須在彼此的 24 小時內,如 HLSTimestampRange 文件所述。

    您將收到如下所示的回應:

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

    請勿將此字符共用或存放於未經授權的實體可以存取該字符的位置。權杖可讓您存取串流的內容。使用與 AWS 登入資料相同的量值來保護權杖。

    您可以使用此 URL和任何HLS玩家來檢視HLS串流。

    例如,使用VLC媒體播放器。

    您也可以在 Apple Safari HLS 或 Microsoft Edge 瀏覽器URL的位置列中輸入HLS串流工作階段來播放串流。

範例:在 HTML和 HLS中使用 JavaScript

下列範例示範如何使用適用於 JavaScript v2 的 AWS SDK來擷取 Kinesis 影片串流的HLS串流工作階段,並在網頁中播放。本範例說明如何在下列播放器播放影片:

在 中檢視完整的範例程式碼託管網頁 GitHub。

匯入 AWS SDK JavaScript 適用於瀏覽器的

在 網頁中,包含下列指令碼標籤,將 JavaScript v2 的 AWS SDK匯入專案。

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

如需詳細資訊,請參閱 AWS SDK 文件的 JavaScript

設定 Kinesis Video Streams 用戶端

若要使用 存取串流影片HLS,請先建立和設定 Kinesis Video Streams 用戶端。如需其他身分驗證方法,請參閱在 Web 瀏覽器中設定登入資料。

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

應用程式會從HTML頁面上的輸入方塊擷取必要的值。

擷取要HLS播放的端點

使用 Kinesis Video Streams 用戶端來叫用 GetDataEndpointAPI來擷取端點。

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 封存媒體用戶端

在 Kinesis Video Streams 封存媒體用戶端的用戶端組態中,指定您在上一個步驟中取得的端點。

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

擷取HLS串流工作階段 URL

使用 Kinesis Video Streams 封存媒體用戶端來叫用 GetHLSStreamingSessionURLAPI來擷取HLS播放 URL。

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

在網頁上顯示HLS串流

當您有HLS串流工作階段 時URL,請將它提供給影片播放器。提供 URL給影片播放器的方法,是專屬於所使用的播放器。

Video.js

執行下列動作,將 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>

建立videoHTML元素以顯示影片:

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

將 HLSURL設定為HTML影片元素來源:

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

執行下列動作,將 Google Shaka 播放器匯入我們的瀏覽器指令碼:

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

建立videoHTML元素以顯示影片:

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

建立指定影片元素的 Shaka 播放器,並呼叫載入方法:

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

執行下列動作,將 hls.js 匯入我們的瀏覽器指令碼:

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

建立videoHTML元素以顯示影片:

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

建立 hls.js HLS 播放器,給予 URL,並告知其播放:

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 問題

本節說明使用HTTP即時串流 (HLS) 搭配 Kinesis Video Streams 時可能遇到的問題。

擷取HLS串流工作階段URL成功,但在影片播放器中播放失敗

當您可以使用 URL 成功擷取HLS串流工作階段GetHLSStreamingSessionURL,但在將 URL 提供給影片播放器時影片無法播放時,就會發生這種情況。

若要排除這種情況,請嘗試:

  • 判斷影片串流是否在 Kinesis Video Streams 主控台中播放。請考慮主控台顯示的任何錯誤。

  • 如果片段持續時間少於一秒,請將其增加到一秒。如果片段持續時間太短,服務可能會調節玩家,因為它對影片片段的請求太頻繁。

  • 確認每個HLS串流工作階段僅供一個玩家URL使用。如果多個玩家使用單一HLS串流工作階段 URL,服務可能會收到太多請求並加以調節。

  • 確認您的播放器支援您為HLS串流工作階段指定的所有選項。為以下參數嘗試不同的組合值:

    • ContainerFormat

    • PlaybackMode

    • FragmentSelectorType

    • DiscontinuityMode

    • MaxMediaPlaylistFragmentResults

    有些媒體播放器 (例如 HTML5和行動播放器) 通常僅支援 f HLS MP4 容器格式。其他媒體播放器 (例如 Flash 和自訂播放器) 可能僅支援 HLS TS MPEG 容器格式。建議您嘗試 ContainerFormat 參數以開始故障診斷。

  • 確認每個片段都有一致的軌道數量。確認串流中的片段並未在同時擁有音訊和視訊音軌,以及只有視訊音軌之間變更。同時確認編碼器設定 (解析度和影格速率) 在每個軌跡中的片段之間沒有變更。

製作者和播放器間的延遲太高

當視訊擷取時間與影片播放器播放的時間延遲太高時,便會發生此狀況。

影片會以HLS每個片段為基礎播放。因此,延遲不得少於片段持續時間。延遲也包含緩衝和傳輸資料所需的時間。如果您的解決方案需要不到一秒的延遲,請考慮GetMediaAPI改用 。

您可以調整以下參數來降低整體延遲,但調整這些參數也可能降低影片品質或增加重新緩衝的時間。

  • 片段持續時間 – 片段持續時間是由影片編碼器產生之關鍵影格頻率所控制,串流中分割之間的影片量。建議的值為一秒。擁有較短片段持續時間,代表在傳輸影片資料至服務之前所等待的片段完成時間較少。較短的片段也能讓服務處理得更快速。不過,如果片段持續時間過短,播放器因內容播畢而停止並緩衝內容的可能性也會提升。如果片段持續時間少於 500 毫秒,則製作者可能建立了太多請求以致服務開始對其進行調節。

  • 位元速率:位元速率較低的影片串流讀取、寫入和傳輸所需的時間較少。不過,較低位元速率的影片串流通常會有較差的影片品質。

  • 媒體播放清單中的片段計數 – 延遲敏感的玩家應該只載入媒體播放清單中的最新片段。大多數玩家是從最早的片段開始。透過減少播放清單中的片段數量,您可以減少先前片段和新片段之間的時間間隔。如果播放清單有延遲將新片段新增至播放清單,或者玩家取得更新後的播放清單有延遲,則播放期間可以略過片段。我們建議使用 3-5 個片段,並使用設定為僅從播放清單中載入最新片段的玩家。

  • 播放器緩衝大小 – 大多數影片播放器具有可設定的最短緩衝持續時間,通常預設為 10 秒。如需將延遲降到最低,您可以將此值設為 0 秒。不過,這樣做表示如果有任何延遲產生片段,則玩家會重新緩衝,因為玩家將沒有吸收延遲的緩衝區。

  • 播放器「追上」 – 如果緩衝區填滿,影片播放器通常不會自動擷取播放到影片緩衝區的正面,例如延遲片段導致片段的待處理項目播放時。自訂播放器可以透過刪除影格或提高播放速度 (例如提高至 1.1 倍速) 趕上緩衝之前來避免這點。此操作會造成播放不穩定,或在播放器追上進度時加快播放速度,而若緩衝大小保持過短時,重新緩衝可能更為頻繁。