이 페이지는 Cloud Translation API를 통해 번역되었습니다.

실시간 스트리밍

Cast SDK에는 라이브 콘텐츠를 지원하는 API가 내장되어 있습니다. 여기에는 유연성 있는 즉시 사용 가능한 UI가 포함되며 API와 함께 개발자는 코드 몇 줄만으로 풍부한 실시간 환경을 만들 수 있습니다. Live API는 시작 및 종료 시간, 프로그램 메타데이터, DVR 컨트롤, 검색 가능한 창 표시를 지원합니다.

이 가이드에서는 핵심 라이브 시나리오를 구성하기 위한 코드 및 메타데이터 샘플과 각 시나리오가 어떻게 표시되는지 보여주는 스크린샷을 포함하여 Live API로 스트림을 구성하는 방법을 보여줍니다.

기본 요건

이 가이드를 검토하기 전에 웹 수신기 구현의 기본 지식을 숙지하고 있어야 합니다. 또한 코드 샘플을 실행하려면 Cast에 지원되는 미디어 유형 중 하나를 준수하는 실시간 스트림에 액세스해야 합니다. 일반적으로 실시간 기능은 지원되는 미디어의 일반적인 실시간 스트림 구성을 지원합니다.

다음 용어는 가이드 전체에서 사용됩니다.

탐색 가능 기간 - 사용자가 탐색할 수 있는 실시간 스트림의 범위입니다.
실시간 에지 - 플레이어가 사용할 수 있는 실시간 스트림의 최신 부분
재생 헤드: 현재 재생 위치의 UI 타임스탬프

실시간 스트림 전송

콘텐츠용 Live API를 사용하도록 웹 수신기 SDK를 구성하는 방법에는 두 가지가 있습니다.

웹 수신기 애플리케이션에서 LOAD 메시지 가로채기를 사용합니다. (권장)
전송 측 또는 수신 측에서 생성된 로드 요청 사용

인터셉터는 로드 요청에 관한 모든 중요 메타데이터를 포함하는 LoadRequestData 객체를 제공합니다. 실시간 요청에 관한 로드 요청을 나타내려면 mediaInformation 객체의 streamType를 StreamType.LIVE로 설정하기만 하면 됩니다. MediaInformation.duration는 -1이어야 합니다. 콘텐츠가 LIVE일 때 플레이어 인스턴스가 이를 계산해야 하기 때문입니다.

/*
* This interceptor is called before your content is loaded by a Cast device
*/
playerManager.setMessageInterceptor(
   cast.framework.messages.MessageType.LOAD,
   request => { /* cast.framework.messages.LoadRequestData */
       request.media.streamType = cast.framework.messages.StreamType.LIVE;
   return request;
});

프로그램 가이드 데이터 추가

실시간 스트림, 특히 TV 채널과 같이 오래 실행되는 스트림은 실시간 스트림의 현재 재생 위치를 기반으로 화면 가이드/프로그래밍 메타데이터를 표시할 수 있습니다. 콘텐츠 제공업체는 최종 사용자 환경을 위해 웹 수신기 애플리케이션에 프로그래밍 메타데이터를 포함하는 것이 좋습니다.

이전 예시에서 스트림이 실시간 스트림임을 표시한 것과 동일한 방식으로 Load 메시지 인터셉터에서 스트림의 초기 가이드 데이터를 구성할 수 있습니다. 실시간 스트림의 개별 섹션 또는 프로그램은 MediaMetadata 객체로 표시되며 큐에 저장됩니다. 프로그램 유형에 따라 다른 MediaMetadata 클래스(예: TvShowMediaMetadata, MovieMediaMetadata, MusicTrackMediaMetadata)가 있습니다.

다음 코드 스니펫에서는 MediaMetadata 객체를 사용하여 sectionStartAbsoluteTime 속성이 지정된 UNIX 타임스탬프로 각 프로그램의 시작 시간을 지정합니다. 프로그램 기간은 초 단위로 표시됩니다.

// The metadata for a single TV show
const currentShow = new cast.framework.messages.TvShowMediaMetadata();
currentShow.episode = 15;
currentShow.seriesTitle = 'The Odyssey';
currentShow.title = 'Scylla and Charybdis';
currentShow.sectionStartAbsoluteTime = toUnixTimestamp('9:00 PM');
currentShow.sectionDuration = HOUR_IN_SECONDS;

const previousShow = new ...;
const nextShow = new ...;

const containerMetadata = new cast.framework.messages.ContainerMetadata();
containerMetadata.title = 'My TV Channel';
containerMetadata.sections = [previousShow, currentShow, nextShow];

playerManager.getQueueManager().setContainerMetadata(containerMetadata);

실시간 탐색 가능 범위

Cast SDK에는 사용자가 확장 컨트롤러 또는 터치 지원 기기의 터치 컨트롤을 사용하여 스트림 내에서 플레이헤드를 이동할 수 있는 UI 요소와 컨트롤이 포함되어 있습니다.

LiveSeekableRange는 사용자가 탐색할 수 있는 스트림의 시간 범위를 나타냅니다. 웹 수신기에서 LiveSeekableRange 객체를 반환하는 PlayerManager.getLiveSeekableRange()를 통해 탐색 가능한 범위에 관한 정보에 액세스할 수 있습니다. 객체의 기본 속성은 다음과 같습니다.

start - 초 단위의 스트림의 시작을 기준으로 하는 범위의 시작 시간 (초)입니다.
end: 스트림의 시작 부분을 기준으로 플레이어가 사용할 수 있는 최대 시간을 초 단위로 나타냅니다.
isMovingWindow - 탐색 가능한 범위가 스트림으로 이동 (즉, 매니페스트에서 이전 세그먼트가 삭제됨)하는지 여부를 나타내는 부울 값입니다. 모든 실시간 스트림에서 이 값이 true여야 합니다.
isLiveDone - 실시간 스트림이 완료되었는지를 나타내는 부울 값, 즉 새 세그먼트가 생성되지 않음

탐색 가능한 범위의 크기는 start 및 end 사이의 시간으로 표현되며 스트림에서 사용 가능한 세그먼트 수에 따라 결정되며 스트림과 함께 이동합니다. 예를 들어 스트림 시작 시 탐색 가능한 범위가 {start:0, end: 600, isMovingWindow: false, isLiveDone: false}인 경우 스트림이 시작된 후 10초가 지나면 {start: 10, end: 610, isMovingWindow: true, isLiveDone: false}가 될 수 있습니다. 탐색 가능한 범위의 시작 및 종료 시간은 새 세그먼트를 생성하는 데 걸리는 시간을 기준으로 업데이트된다는 점에 유의해야 합니다. 따라서 스트림의 일반적인 세그먼트 길이가 10초라면 약 10초마다 시작 및 종료 시간도 업데이트됩니다.

탐색 사용 중지

스트림 내에서 탐색 기능을 사용 중지하려면 웹 수신기의 지원되는 미디어 명령어에서 탐색 기능을 삭제해야 합니다.

// disable seeking in the LOAD messageInterceptor
playerManager.removeSupportedMediaCommands(cast.framework.messages.Command.SEEK, true);

발신자 애플리케이션과 터치 디스플레이에 지원되는 SEEK 신호에서 지원되는 미디어 명령어를 삭제하여 탐색 기능을 사용 중지하지만 'Hey Google, 30초 뒤로 탐색'과 같은 음성 명령을 사용 중지하지는 않습니다. 음성에 미디어 명령어를 사용 중지하는 방법에 관한 자세한 내용은 지원되는 미디어 명령어를 참고하세요.

라이브 프레임워크 이벤트

두 이벤트 LIVE_ENDED 및 LIVE_IS_MOVING_WINDOW_CHANGED가 Live API에 포함되어 있습니다. 두 이벤트 모두에 현재 실시간 탐색 가능한 범위가 포함된 LiveStatusEvent 객체가 전달됩니다.

이벤트	설명
`LIVE_ENDED`	실시간 스트림이 종료될 때 트리거됩니다. 이 시점에는 `LiveSeekableRange`의 end 값 업데이트가 중단됩니다. 사용자는 실시간 탐색 가능한 범위 내의 콘텐츠를 계속 볼 수 있습니다.
`LIVE_IS_MOVING_WINDOW_CHANGED`	실시간 스트림의 탐색 가능한 범위가 고정 기간에서 이동 기간으로 또는 그 반대로 변경되면 트리거됩니다. 실시간 스트림의 경우 플레이어가 매니페스트가 이전 세그먼트를 삭제하는 것을 감지하면 이 문제가 발생합니다.

실시간 스트림 시나리오

실시간 스트리밍에는 8가지 시나리오 유형이 있으며 각 시나리오는 3가지 핵심 설정을 통해 구성됩니다.

스트림 시작 시간이 설정되어 있습니다.
스트림의 종료 시간이 있습니다.
사용자가 실시간 스트림의 탐색 가능한 기간 내에 탐색이 허용됩니다.

이러한 값을 구성하는 방법은 프로그램 가이드 데이터 추가를 참고하세요.

다음은 Live API에서 지원하는 시나리오에 대한 설명과 스크린샷입니다. T1 및 T2 변수는 UI의 왼쪽과 오른쪽에 있는 타임스탬프를 나타내는 데 사용됩니다.

	시작 시간	종료 시간	탐색 가능	T1	T2
시나리오 1	아니요	아니요	아니요	플레이헤드	표시되지 않음
~~시나리오 2~~	~~아니요~~	~~아니요~~	예	~~플레이헤드~~	~~표시되지 않음~~
~~시나리오 3~~	~~아니요~~	예	~~아니요~~	~~플레이헤드~~	~~표시되지 않음~~
~~시나리오 4~~	~~아니요~~	예	예	~~플레이헤드~~	~~표시되지 않음~~
~~시나리오 5~~	예	~~아니요~~	~~아니요~~	~~시작 시간 표시~~	~~플레이헤드~~
~~시나리오 6~~	예	~~아니요~~	예	~~시작 시간 표시~~	~~플레이헤드~~
시나리오 7	예	예	아니요	시작 시간 표시	종료 시간 표시
시나리오 8	예	예	예	시작 시간 표시	종료 시간 표시

시나리오 1

시작 시간	종료 시간	탐색 가능	T1	T2
시작 시간	종료 시간	탐색 가능	T1	T2
아니요	아니요	아니요	플레이 헤드	표시되지 않음

시나리오 1에는 시작 또는 종료 시간이 없으며 사용자가 스트림 내에서 탐색할 수 없습니다. 사용자가 스트림을 중지하면 스트림이 일시중지된 위치 대신 라이브 에지에서 재생이 다시 시작됩니다.

시나리오 7

시계 시간이 있는 시나리오 7의 Chromecast 실시간 UI를 표시하는 TV 시계 시간이 있는 시나리오 7의 실시간 UI를 보여주는 휴대전화

시작 시간	종료 시간	탐색 가능	T1	T2
시작 시간	종료 시간	탐색 가능	T1	T2
예	예	아니요	플레이헤드	프로그램 기간

시나리오 7에 시작 시간과 종료 시간이 있지만 찾을 수 없습니다. UI에 있는 2개의 타임스탬프 T1 및 T2는 현재 플레이헤드 시간과 총 프로그램 기간을 각각 나타냅니다. 사용자가 재생을 일시중지/재개하면 스트림의 실시간 가장자리에서 스트림이 다시 시작됩니다. 위 예에서 탐색 메뉴의 빨간색 섹션은 사용자가 시청을 시작한 후의 스트림 부분을 나타냅니다.

시나리오 8

시계 시간이 있는 시나리오 8의 Chromecast 실시간 UI를 표시하는 TV 시계 시간이 있는 시나리오 8의 실시간 UI를 보여주는 휴대전화

시작 시간	종료 시간	탐색 가능	T1	T2
시작 시간	종료 시간	탐색 가능	T1	T2
예	예	예	플레이헤드	프로그램 기간

시나리오 7에는 시작 시간과 종료 시간이 있어 찾을 수 있습니다. UI에 있는 2개의 타임스탬프(T1 및 T2)는 각각 현재 플레이헤드 시간과 총 프로그램 기간을 나타냅니다. 사용자가 재생을 일시중지/재개하면 스트림이 탐색 가능한 기간 내에 있는 경우 일시중지한 시간에 재개됩니다. 탐색 막대의 빨간색 영역은 사용자가 찾아볼 수 있는 위치를 나타내고 흰색 부분은 앞으로 이동할 수 있는 영역을 나타냅니다.

시나리오 구성

스트림을 특정 실시간 시나리오로 구성하는 방법은 3가지입니다.

스트림 유형 설정 - 스트림을 실시간 스트림으로 표시합니다.
프로그램 가이드 데이터 추가 - MediaMetadata 객체에서 시작 시간과 기간을 설정합니다.
탐색 기능 구성 - 탐색 기능을 사용 설정 또는 중지합니다.

재생 동작

일시중지된 동안에도 UI는 재생 메타데이터를 계속 업데이트합니다. 여기에는 재생 헤드 및 실시간 에지 시간이 포함됩니다. 스트림을 재개하면 스트림 구성에 따라 달라지는 몇 가지 동작이 있습니다.

탐색 가능한 스트림

탐색 가능한 스트림이 재개되면 다음 사항이 적용됩니다.

실시간 가장자리를 실제 위치로 업데이트하고 탐색 가능한 범위가 이에 맞게 조정됩니다.
플레이헤드가 현재 프로그램을 지나 점프하면 스크러빙 막대가 새 프로그램의 메타데이터 (업데이트가 가능한 경우 시작 시간 및 종료 시간 포함)로 업데이트됩니다.
탐색 가능한 창의 길이가 'X'인 경우 탐색 가능 범위는 최대 'X'까지 또는 프로그램의 시작 지점 중 더 작은 값으로 확장됩니다.
사용자가 현재 시간을 더 이상 탐색 가능 기간이 아니도록 충분히 일시중지한 경우, 탐색 가능 창의 가장 이른 지점 (가장 왼쪽)에 스트림이 다시 시작됩니다.

일시중지를 해제한 후 라이브 에지에서 재생을 다시 시작하려면 LiveSeekableRange.end을 탐색합니다.

let playerManager = cast.framework.CastReceiverContext.getInstance().getPlayerManager();
// Intercept the message to PLAY
playerManager.setMessageInterceptor(cast.framework.messages.MessageType.PLAY, (requestData) => {
  ...
  if (playerManager.getLiveSeekableRange()) {
    // Resume playback at the live edge
    playerManager.seek(playerManager.getLiveSeekableRange().end);
  } else {
    return requestData;
  }
  ...
});

탐색 불가능 스트림

탐색할 수 없는 스트림을 재개하면 다음 사항이 적용됩니다.

이 경우 라이브 에지에서 재생이 다시 시작됩니다.
실시간 가장자리가 현재 프로그램을 넘어서면 스크러빙 막대가 새 프로그램의 메타데이터 (사용 가능한 경우 시작 시간 및 종료 시간 포함)로 업데이트되어야 합니다.

API 노출 영역 변경사항 및 실시간 UI 맞춤설정

Cast SDK는 즉시 사용 가능한 UI를 사용하는 대신 맞춤 사용자 인터페이스를 만들기 위한 지원 기능이 내장되어 있습니다. 하지만 인터페이스를 맞춤설정할 때는 Cast UX 디자인 체크리스트를 따르는 것이 중요합니다.

웹 수신기

웹 수신기에서 PlayerData에는 개발자가 실시간 스트림의 맞춤 인터페이스를 확장할 수 있도록 다음 필드가 포함되어 있습니다.

isLive: VOD와 달리 현재 스트림이 실시간 스트림인지 여부를 나타내는 플래그.
liveSeekableRange - DVR 창을 구분하는 화면에 표시할 탐색 가능한 범위입니다.
mediaStartAbsoluteTime - 섹션이 절대 시간으로 시작된 시점(UNIX 에포크)
sectionStartTimeInMedia - 미디어 시작 시간을 기준으로 한 섹션 시작 시간(초)입니다.
sectionDuration: 섹션 길이(초)입니다.

또한 UI를 맞춤설정할 때 두 가지 실시간 이벤트를 고려해야 합니다.

Android SDK

실시간 기능의 일부로 UIMediaController의 Android 탐색바 위젯 사용이 지원 중단되는 대신 CastSeekBar가 사용됩니다.

광고 시점

보조 이미지