를 AWS CLI 사용하여 HLS 스트리밍 세션 URL을 검색할 수 있습니다.예: HTML에서 HLS를 사용하고 JavaScript HLS 문제 해결

HLS를 사용한 비디오 재생

HTTP 라이브 스트리밍 (HLS) 은 업계 표준 HTTP 기반 미디어 스트리밍 통신 프로토콜입니다. HLS를 사용하여 Kinesis 비디오 스트림을 볼 수 있습니다 (라이브 재생 또는 아카이브된 비디오 보기).

실시간 재생을 위해 HLS를 사용할 수 있습니다. 지연 시간은 일반적으로 3~5초이지만 사용 사례, 플레이어 및 네트워크 상태에 따라 1~10초 사이일 수 있습니다. HLS 스트리밍 세션 URL을 프로그래밍 방식으로 또는 수동으로 제공하여 타사 플레이어(예: Video.js 또는 Google Shaka Player)를 사용해 비디오 스트림을 표시할 수 있습니다. Apple Safari 또는 Microsoft Edge 브라우저의 위치 표시줄에 HLS 스트리밍 세션 URL을 입력하여 비디오를 재생할 수도 있습니다.

HLS를 사용하여 Kinesis 비디오 스트림을 보려면 먼저 GetHLS URL을 사용하여 스트리밍 세션을 생성하십시오. StreamingSession 이 작업은 HLS 세션에 액세스하기 위한 URL(세션 토큰을 포함)을 반환합니다. 그런 다음 미디어 플레이어 또는 독립 실행형 애플리케이션에서 URL을 사용하여 스트림을 표시할 수 있습니다.

중요

Kinesis Video Streams로 전송된 모든 미디어를 HLS를 통해 재생할 수 있는 것은 아닙니다. 특정 업로드 GetHLSStreamingSessionURL 요구 사항은 를 참조하십시오.

주제

를 AWS CLI 사용하여 HLS 스트리밍 세션 URL을 검색할 수 있습니다.
예: HTML에서 HLS를 사용하고 JavaScript
HLS 문제 해결

를 AWS CLI 사용하여 HLS 스트리밍 세션 URL을 검색할 수 있습니다.

아래 절차에 따라 를 사용하여 Kinesis 비디오 스트림용 HLS 스트리밍 세션 URL을 생성하십시오. AWS CLI

설치 지침은 사용 AWS Command Line Interface 설명서를 참조하십시오. 설치 후 자격 증명 및 지역을 AWS CLI사용하여 구성하십시오.

또는 AWS CLI 설치 및 구성된 AWS CloudShell 터미널을 여십시오. 자세한 내용은 AWS CloudShell 사용 설명서를 참조하십시오.

Kinesis 비디오 스트림의 HLS URL 엔드포인트를 검색하십시오.

터미널에 다음을 입력합니다.


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

다음과 같은 응답을 받게 됩니다.


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

반환된 엔드포인트에 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 과 같습니다.
이 예에서는 종료 타임스탬프를 지정하지 않습니다. 즉, 세션이 만료될 때까지 세션에 새로 수집된 미디어가 계속 포함됩니다.

LIVE_REPLAY재생 모드를 지정하고 HLS 프래그먼트 셀렉터를 지정하여 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 프래그먼트 셀렉터로 지정된 미디어가 포함됩니다. 미디어 플레이어에서 이러한 유형의 세션을 재생할 때 사용자 인터페이스에는 일반적으로 재생 창에서 표시할 위치를 선택할 수 있는 스크러버 컨트롤이 표시됩니다.

스트림의 특정 섹션에 대한 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 과 같습니다.
재생 모드 및 HLS 프래그먼트 셀렉터를 지정한 상태에서 API를 호출합니다. GetHLSStreamingSessionURLON_DEMAND
```
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 미디어 플레이어를 사용하세요.

애플 사파리 또는 마이크로소프트 엣지 브라우저의 위치 표시줄에 HLS 스트리밍 세션 URL을 입력하여 HLS 스트림을 재생할 수도 있습니다.

예: HTML에서 HLS를 사용하고 JavaScript

다음 예제는 JavaScript v2용 AWS SDK를 사용하여 Kinesis 비디오 스트림의 HLS 스트리밍 세션을 검색하고 웹 페이지에서 재생하는 방법을 보여줍니다. 예제에서는 다음 플레이어에서 비디오를 재생하는 방법을 보여줍니다.

전체 예제 코드와 호스팅된 웹 페이지는 에서 확인하십시오. GitHub

JavaScript 브라우저용 AWS SDK 가져오기

웹 페이지에 다음 스크립트 태그를 포함하여 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 클라이언트를 생성하고 구성하십시오. 다른 인증 방법은 웹 브라우저에서 자격 증명 설정을 참조하십시오.


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

애플리케이션은 HTML 페이지의 입력 상자에서 필요한 값을 검색합니다.

HLS 재생을 위한 엔드포인트 검색

Kinesis Video Streams 클라이언트를 사용하여 API를 호출하여 GetDataEndpoint 엔드포인트를 검색합니다.


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 아카이브 미디어 클라이언트를 사용하여 API를 GetHLSStreamingSessionURL 호출하여 HLS 재생 URL을 검색합니다.


const getHLSStreamingSessionURLOptions = {
    StreamName: 'YourStreamName',
    PlaybackMode: 'LIVE'
};
const getHLSStreamingSessionURLResponse = await kinesisVideoArchivedMediaClient.getHLSStreamingSessionURL(getHLSStreamingSessionURLOptions);
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>

비디오를 표시할 video HTML 요소를 만드세요.


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

HLS URL을 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>

동영상을 표시할 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 를 브라우저 스크립트로 가져오려면 다음과 같이 하십시오.


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

비디오를 표시할 video HTML 요소를 만드세요.


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

hls.js 플레이어를 만들고 HLS URL을 지정한 다음 재생하라고 지시하세요.


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

HLS 문제 해결

이 섹션에서는 Kinesis Video Streams와 함께 HTTP 라이브 스트리밍 (HLS) 을 사용할 때 발생할 수 있는 문제를 설명합니다.

문제

HLS 스트리밍 세션 URL 검색이 성공하지만 비디오 플레이어에서 재생이 실패함
생산자와 플레이어 사이에 지연 시간이 너무 김

HLS 스트리밍 세션 URL 검색이 성공하지만 비디오 플레이어에서 재생이 실패함

이 상황은 GetHLSStreamingSessionURL을 사용해 HLS 스트리밍 세션 URL을 성공적으로 검색할 수 있지만 비디오 플레이어에 이 URL이 제공하면 비디오가 재생되지 않는 경우에 발생합니다.

이 상황을 해결하려면 다음과 같이 시도해 보십시오.

Kinesis Video Streams 콘솔에서 비디오 스트림을 재생할지 여부를 결정합니다. 콘솔에 표시되는 모든 오류를 고려합니다.
조각 기간이 1초 미만이라면 1초로 늘립니다. 프래그먼트 지속 시간이 너무 짧으면 서비스가 비디오 프래그먼트를 너무 자주 요청하기 때문에 플레이어가 제한될 수 있습니다.
각 HLS 스트리밍 세션 URL을 한 플레이에서만 사용하는지 확인합니다. 2대 이상의 플레이어가 단일 HLS 스트리밍 세션 URL을 사용할 경우 서비스가 너무 많은 요청을 수신하여 스로틀링이 발생할 수 있습니다.
플레이어가 HLS 스트리밍 세션에 지정하는 모든 옵션을 지원하는지 확인하십시오. 다음 파라미터 값을 다르게 조합하여 시도해 봅니다.
- ContainerFormat
- PlaybackMode
- FragmentSelectorType
- DiscontinuityMode
- MaxMediaPlaylistFragmentResults
(HTML5 및 모바일 플레이어와 같은) 일부 미디어 플레이어에서는 일반적으로 fMP4 컨테이너 형식의 HLS만 지원됩니다. 다른 미디어 플레이어 (예: Flash 및 커스텀 플레이어) 는 MPEG TS 컨테이너 형식의 HLS만 지원할 수 있습니다. ContainerFormat파라미터를 시험해 보고 문제 해결을 시작하는 것이 좋습니다.
각 조각의 트랙 수가 일정한지 확인합니다. 스트림의 프래그먼트가 오디오와 비디오 트랙을 둘 다 포함할지 아니면 비디오 트랙만 포함할지 여부를 결정하세요. 또한 각 트랙의 프래그먼트 간에 인코더 설정 (해상도 및 프레임 속도) 이 변경되지 않는지 확인하십시오.

생산자와 플레이어 사이에 지연 시간이 너무 김

이 상황은 비디오가 캡처되는 시점에서 비디오 플레이에서 재생되는 시점까지의 지연 시간이 너무 긴 경우입니다.

비디오는 조각 단위로 HLS를 통해 재생됩니다. 따라서 지연 시간은 조각 기간보다 짧을 수 없습니다. 또한 지속 시간에는 데이터 버퍼링 및 전송에 필요한 시간도 포함됩니다. 솔루션에 1초 미만의 지연 시간이 필요할 경우 대신 GetMedia API를 사용할 것을 고려해 보십시오.

다음 파라미터를 조정하여 전체 지연 시간을 단축할 수 있습니다. 그러나 파라미터를 조정하면 비디오 품질이 저하되거나 재버퍼링 비율이 높아질 수도 있습니다.

프래그먼트 지속 시간 - 프래그먼트 지속 시간은 비디오 인코더에서 생성되는 키프레임의 빈도에 따라 제어되는 스트림의 분할 간 비디오 양입니다. 권장되는 값은 1초입니다. 조각 기간이 짧으면 서비스에 비디오 데이터를 전송하기 전에 조각이 완료될 때까지 대기해야 하는 시간이 작아집니다. 또한 조각이 짧을수록 서비스 처리 속도가 빨라집니다. 그러나 조각 기간이 너무 짧을 경우 플레이어가 콘텐츠가 떨어져 재생을 멈추고 콘텐츠를 버퍼링할 가능성이 증가합니다. 조각 기간이 500밀리초 미만일 경우 생산자가 너무 많은 요청을 생성하여 서비스에서 스로틀링이 발생할 수 있습니다.
비트 전송률 - 비트 전송률이 낮은 비디오 스트림은 읽기, 쓰기 및 전송하는 데 걸리는 시간이 더 짧습니다. 그러나 일반적으로 비디오 스트림의 비트레이트가 낮으면 비디오 품질도 떨어집니다.
미디어 재생 목록의 프래그먼트 수 - 지연 시간에 민감한 플레이어는 미디어 재생 목록의 최신 프래그먼트만 로드해야 합니다. 대부분의 플레이어는 대신 가장 빠른 프래그먼트부터 시작합니다. 재생 목록의 프래그먼트 수를 줄이면 이전 프래그먼트와 새 프래그먼트 사이의 시간 간격을 줄일 수 있습니다. 재생 목록 크기가 작으면 재생 목록에 새 조각을 추가하는 데 지연이 발생하거나 플레이어가 업데이트된 재생 목록을 가져오는 데 지연이 발생하는 경우 재생 중에 프래그먼트를 건너뛸 수 있습니다. 3~5개의 프래그먼트를 사용하고 재생 목록에서 최신 프래그먼트만 로드하도록 구성된 플레이어를 사용하는 것이 좋습니다.
플레이어 버퍼 크기 — 대부분의 비디오 플레이어에는 구성 가능한 최소 버퍼 지속 시간이 있으며, 일반적으로 기본값은 10초입니다. 지연 시간을 최소화하기 위해 이 값을 0초로 설정할 수 있습니다. 하지만 이렇게 하면 플레이어가 지연을 흡수할 버퍼가 없기 때문에 프래그먼트를 생성하는 데 지연이 발생하는 경우 플레이어가 다시 버퍼링하게 됩니다.
플레이어 “catch up” — 비디오 플레이어는 일반적으로 버퍼가 가득 차면 비디오 버퍼 앞쪽까지 자동으로 재생되지 않습니다. 예를 들어 지연된 프래그먼트로 인해 프래그먼트의 백로그가 재생되는 경우입니다. 사용자 지정 플레이어는 프레임을 제거하거나 재생 속도를 높여(예: 1.1x) 버퍼의 앞부분까지 캐치업하여 이를 방지할 수 있습니다. 그러면 플레이어가 캐치업하는 과정에서 재생이 중간에 끊기거나 속도가 빨라질 수 있고, 버퍼 크기가 짧게 유지되면 재버퍼링이 더 빈번해질 수 있습니다.

javascript가 브라우저에서 비활성화되거나 사용이 불가합니다.

AWS 설명서를 사용하려면 Javascript가 활성화되어야 합니다. 지침을 보려면 브라우저의 도움말 페이지를 참조하십시오.

문서 규칙

재생 요구 사항

MPEG-DASH를 사용한 비디오 재생