맞춤 웹 수신기

이동 시작 - 기본 맞춤 웹 수신기를 만드는 코드는 간단합니다. 웹 수신기 앱을 등록한 다음 기본 Web Receiver 앱을 생성하세요.

웹 수신기 SDK는 내장 미디어 플레이어를 사용하여 원활하고 간편한 재생 환경을 제공합니다. Google 어시스턴트뿐만 아니라 모든 발신자 및 터치 지원 기기에서 자동으로 지원되는 Cast 전용 기능을 즉시 지원합니다. 새 기능이 출시되면 추가 발신자 변경 없이 계속 지원됩니다.

맞춤 웹 수신기는 맞춤 개발된 HTML5 앱으로, Cast 지원 기기에 콘텐츠를 표시하기 위해 호스팅되어야 합니다. 비즈니스 요구사항에 따라 커스텀 웹 수신기를 만들어야 할 수도 있습니다. 사용할 수신기 유형을 결정하는 데 도움이 필요하면 웹 수신기 선택 가이드를 참조하세요.

Google Web Receiver SDK

Web Receiver 앱은 다음 참조를 사용하여 Web Receiver API에 액세스합니다.

<script src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js"></script>

URL 프로토콜 권장사항: 위의 URL은 'http:' 또는 'https:' 프로토콜을 지정하지 않습니다. cast_receiver_framework.js 리소스를 제공할 때 이러한 프로토콜을 생략하면 웹 수신기 앱을 호스팅하는 서버와 동일한 프로토콜을 사용하여 이 리소스를 가져올 수 있습니다. 즉, 개발용 HTTP와 프로덕션용 HTTPS 간에 전환하는 것이 투명하며 코드를 변경할 필요가 없습니다. 게시된 웹 수신기 앱은 TLS를 지원하는 서버에서 호스팅되어야 합니다.

SDK 미리보기

Cast 웹 수신기 SDK의 출시 전 버전도 비프로덕션 애플리케이션을 테스트하는 데 사용할 수 있습니다. SDK 미리보기 URL에 관한 자세한 내용은 Google Cast 웹 수신자 SDK 미리보기 URL을 참고하세요.

애플리케이션 수명 주기

웹 수신기 앱 수명 주기는 웹 수신기가 Cast 기기에 로드된 시점부터 시작되어 애플리케이션이 해제되고 Cast 기기가 기본 상태로 되돌아가는 시점까지 진행됩니다.

웹 수신기 앱의 수명 주기 동안 웹 수신기와 연결된 발신자 애플리케이션 간에 메시지가 교환됩니다. 발신자 애플리케이션은 특정 앱 ID를 사용하여 세션 생성을 요청하는 초기 메시지를 Google Cast 기기에 전송합니다. Google 수신기가 Web Receiver 앱을 로드하려고 시도하므로 Web Receiver의 수명 주기가 시작됩니다. 네트워크 문제가 없다고 가정하면 앱 수신기와 연결된 확인된 URL을 사용하여 네트워크에서 Web Receiver 앱이 다운로드됩니다. 로드되면 Web Receiver 앱은 설정 작업을 실행하고 연결된 모든 발신자 애플리케이션의 메시지를 처리할 준비가 되었음을 나타냅니다.

웹 수신기 앱은 다음 조건에서 해제 (현재 수명 주기를 종료하고 애플리케이션을 닫을 수 있음)할 수 있습니다.

  • 웹 수신기 앱은 연결된 마지막 발신자로부터 애플리케이션 세션을 종료하는 명시적 메시지를 받습니다.
  • Web Receiver 앱이 연결된 발신자 없이 정의된 기간 동안 유휴 상태였던 경우 애플리케이션 세션을 종료하기로 결정합니다.
  • 다른 전송 세션이 시작되었습니다.
  • 정상적인 수명 주기 동안 웹 수신기에서 치명적인 오류가 발생합니다.

웹 수신자 SDK는 UX 가이드라인에 따라 모든 일반적인 사례를 처리합니다.

전공

Web Receiver SDK 프레임워크에는 2가지 주요 클래스가 있습니다.

  • cast.framework.CastReceiverContext - 전체 프레임워크를 관리하고 필요한 라이브러리를 로드합니다. 이 객체를 사용하여 다음 작업을 할 수 있습니다.

    • 애플리케이션 구성 옵션 설정
    • 시스템 이벤트 처리 (예: 발신자 연결 또는 연결 해제됨)
    • 맞춤 채널 만들기
    • 전송 통신 시작
  • cast.framework.PlayerManager - 미디어 재생을 관리합니다. 전송자의 요청에 따라 기본 플레이어와 미디어 요소를 처리합니다. 이 객체를 사용하여 다음 작업을 할 수 있습니다.

    • 재생 작업 처리
    • 발신자의 재생 관련 요청 처리
    • 재생 관련 이벤트 처리

Web Receiver 앱 등록

웹 수신기 앱을 개발하기 전에 Google Cast SDK 개발자 콘솔에 웹 수신기 앱을 등록해야 합니다. 자세한 내용은 등록을 참고하세요. 모든 웹 수신기 앱은 발신자 애플리케이션이 웹 API에 발신자 API를 통해 전송하는 명령어 메시지를 앱 ID에 제공해야 합니다. 웹 수신자 애플리케이션을 등록하면 발신자의 API 호출에 포함할 앱 ID를 받게 됩니다.

기본 Web Receiver 앱 만들기

다음은 맞춤설정이 없는 기본 Web Receiver 앱의 기본 구조입니다.

  1. 미디어 플레이어를 나타내는 cast-media-player HTML 요소.
  2. 웹 수신기 프레임워크를 로드하는 스크립트 HTML 요소입니다.
  3. start()를 호출하여 옵션 없이 웹 수신기 앱을 시작합니다.

다음은 맞춤설정 없이 Cast 애플리케이션 프레임워크를 사용하는 웹 수신기 앱의 최소 코드입니다. 이 스크립트를 그대로 정확하게 복사하여 앱에 붙여넣으면 웹 수신자 앱을 만들 수 있습니다.

<html>
<head>
  <script type="text/javascript"
      src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js">
  </script>
</head>
<body>
  <cast-media-player></cast-media-player>
  <script>
    cast.framework.CastReceiverContext.getInstance().start();
  </script>
</body>
</html>

이 시점에서 사용자는 발신기 앱을 열고 Cast 기기에 연결한 다음 미디어로 이동하여 재생을 누르면 웹 수신기가 사용자가 시청할 수 있는 미디어를 TV에 스트리밍하도록 지시합니다.

이 기본 웹 수신자를 맞춤설정된 수신자 앱과 비교합니다.

미디어 및 플레이어

Cast 프레임워크는 cast-media-player HTML 요소로 표시되는 내장 미디어 플레이어를 제공합니다. 이 미디어 플레이어는 MPEG-DASH, HLS, Smooth Streaming과 같은 스트리밍 프로토콜 재생을 지원합니다.

지원되는 미디어 코덱 및 컨테이너 세트는 지원되는 미디어에 나열되어 있습니다. 개발자는 Cast 메시지를 통해 로드, 재생, 일시중지, 탐색과 같은 발신자 시작 작업 목록을 지원할 수 있습니다. 여기서 Cast SDK는 미디어와의 상호작용을 처리합니다. 지원되는 작업 목록은 앱 플랫폼의 발신자 API 참조, Android 발신자의 RemoteMediaClient, iOS 발신자의 GCKMediaControlChannel, 웹 발신자의 Media을 참조하세요.

교차 출처 리소스 공유

Google Cast는 교차 출처 리소스 공유 (CORS)를 완벽하게 지원합니다. 스트리밍 프로토콜은 대부분의 파일 기반 프로토콜과 달리 XMLHttpRequest를 사용하여 비동기 방식으로 콘텐츠에 액세스합니다. CORS 환경에서 이러한 요청은 리소스가 발생한 서버의 CORS 헤더에 의해 부적절한 액세스로부터 보호됩니다. 즉, 콘텐츠 서버에 포함할 수 있는 위치를 명시합니다. 대부분의 최신 브라우저는 CORS를 완벽하게 지원합니다. iOS 및 Android 기기는 하위 수준에서 콘텐츠에 액세스하며 이러한 헤더를 보지 않습니다. 이 문제는 개발자가 스트리밍 콘텐츠를 사용하려고 할 때 가장 일반적으로 발생하는 문제입니다. 자세한 내용은 교차 출처 리소스 공유를 참고하세요.