광고 시점

개요

Web Receiver SDK는 광고 시점 및 컴패니언 광고를 기본적으로 지원합니다. 표시할 수 있습니다. 광고 게재순위, 광고 소스, 광고 시점 및 관련 광고 시점 클립의 동작을 확인할 수 있습니다. 이 가이드에서는 Break 드림 하나 이상의 광고 또는 범퍼를 포함하는 재생 간격을 의미하며, 각 광고 또는 범퍼는 BreakClip 이러한 광고 시점은 로드 또는 재생 중인 미디어와 연결됩니다.

광고 유형

Web Receiver SDK는 클라이언트 측 광고 삽입 (CSAI) 및 서버를 지원합니다. 병합된 광고 삽입 (SSAI) 클라이언트 연결 광고는 게시자가 수동으로 설정할 수 있습니다. VAST 및 VMAP 템플릿 파일에서 추출된 후 사용할 수 있습니다. 서버 연결 광고는 콘텐츠가 로드되기 전에 수동으로 지정해야 합니다. 삽입된 광고 또는 콘텐츠 재생 중 동적으로 삽입된 확장형 광고 있습니다. 이러한 각 광고 유형의 구현은 아래에 자세히 설명되어 있습니다.

// Create the BreakClip.
let clipClient = new cast.framework.messages.BreakClip('bc_client');
clipClient.title = 'The Ad Title to be displayed during playback';
clipClient.contentId = 'https://example.com/ad.m3u8';
clipClient.contentType = 'application/vnd.apple.mpegurl';

// Optional: Used when HLS ad container formats differ from the main content's.
clipClient.hlsSegmentFormat = cast.framework.messages.HlsSegmentFormat.FMP4;

// Create the Break using the BreakClip id above.
let breakPostrollClient = new cast.framework.messages.Break(
    'break_postroll_client', ['bc_client'], -1);
breakPostrollClient.isEmbedded = false; // Optional: default is false.
breakPostrollClient.expanded = false; // Optional: default is false.

// Create the VastAdsRequest.
let vastTemplate = new cast.framework.messages.VastAdsRequest();
vastTemplate.adTagUrl = 'https://example.com/ads.xml'

// Create the BreakClip.
let clipVast = new cast.framework.messages.BreakClip('bc_vast');
clipVast.vastAdsRequest = vastTemplate;

// Create the Break using the BreakClip id above.
let breakPostrollVast = new cast.framework.messages.Break(
    'break_postroll_vast', ['bc_vast'], -1);
breakPostrollVast.isEmbedded = false; // Optional: default is false.
breakPostrollVast.expanded = false; // Optional: default is false.

"breaks": [
  {
    "id": "break_postroll_vast",
    "breakClipIds": [
      "bc_vast"
    ],
    "position": 0,
    "isWatched": false
  }
],
"breakClips": [
  {
    "id": "bc_vast"
  }
]

"breaks": [
  {
    "id": "break_postroll_vast",
    "breakClipIds": [
      "GENERATED:0"
    ],
    "position": 0,
    "isWatched": true
  }
],
"breakClips": [
  {
    "id": "bc_vast"
  },
  {
    "id": "GENERATED:0",
    "contentId": "https://example.com/break-clip-1.mpd",
    "contentType": "application/dash+xml",
    "title": "Ad Title Extracted from Template",
    "duration": 10,
    "whenSkippable": 5,
    "clickThroughUrl": "https://example.com/ad-target"
  }
]

// Create the VastAdsRequest.
let vastTemplate = new cast.framework.messages.VastAdsRequest();
vastTemplate.adTagUrl = 'https://example.com/vmap.xml'

// Add it to the MediaInformation of the LoadRequest.
loadRequestData.media.vmapAdsRequest = vastTemplate;

// Create the BreakClip.
let clipEmbedded = new cast.framework.messages.BreakClip('bc_embedded');
clipEmbedded.title = 'The Ad Title to be displayed during playback';
clipEmbedded.duration = 15;

// Create the Break using the BreakClip id above.
let breakPrerollEmbedded = new cast.framework.messages.Break(
    'break_preroll_embedded', ['bc_embedded'], 0);
breakPrerollEmbedded.isEmbedded = true;
breakPrerollEmbedded.expanded = false; // Optional: default is false.

// Create the BreakClip.
let clipEmbeddedExpanded =
    new cast.framework.messages.BreakClip('bc_embedded_expanded');
clipEmbeddedExpanded.title = 'The Ad Title to be displayed during playback';
clipEmbeddedExpanded.duration = 15;

// Create the Break using the BreakClip id above.
let breakPrerollEmbeddedExpanded = new cast.framework.messages.Break(
    'break_preroll_embedded_expanded', ['bc_embedded_expanded'], 0);
breakPrerollEmbeddedExpanded.isEmbedded = true;
breakPrerollEmbeddedExpanded.expanded = true;

플레이어 타임라인 유형

플레이어 인스턴스를 생성할 때 Web Receiver SDK는 타임라인 유형을 선택하여 콘텐츠 재생 중 광고 재생을 지원합니다. 각 타임라인은 특정 광고를 브레이크 유형을 추가할 수 있습니다. 타임라인 유형은 광고 유형: MediaInformation 의 LoadRequestData 삽입된 광고 시점이 있으면 embedded 타임라인이 선택됩니다. 만약 고객 연결 광고 시점이 있는 경우 stitched 타임라인이 선택됩니다. 광고가 없는 경우 SDK는 기본적으로 embedded 확인할 수 있습니다 타임라인을 선택한 후에는 현재 미디어 항목입니다. 아래 표에는 각 타임라인에 대한 자세한 설명이 나와 ���습니다.

아래의 그림 1~3은 다양한 광고 유형이 포함된 일부 콘텐츠와 각 타임라인 값을 조정합니다. 콘텐츠가 프리롤 광고 시점으로 구성됩니다. 미드롤 및 포스트롤 광고 시점 사이에 싱글 브레이크 클립입니다. 콘텐츠 재생 시작 이후의 실제 경과 시간입니다. 주요 콘텐츠의 미디어 시간 및 현재 광고 시점의 시간 재생 브레이크 클립이 각 그림 아래에 정렬됩니다.

</ph> <ph type="x-smartling-placeholder">

</ph> <ph type="x-smartling-placeholder">

</ph> <ph type="x-smartling-placeholder">

브레이크 포지셔닝

개발자는 Web Receiver SDK를 사용하여 광고 시점을 지정할 수 있습니다. 배치될 수 있는 position 드림 Break의 속성입니다. 이 값은 기본 콘텐츠의 미디어 시간에 해당합니다. pre-roll, mid-roll, post-roll 광고 시점을 만드는 데 사용할 수 있습니다. 이는 다음과 같이 정의됩니다.

상호 운용성 매트릭스

표 1에 광고 유형 개요 및 광고 관련 기능과의 호환성

이벤트

키 중단 이벤트가 발생하면 전송 SDK가 BreaksEvent 수신기 앱은 PlayerManager를 사용하여 수신자를 구독할 수 있습니다. addEventListener API에 액세스할 수 있습니다.

이러한 이벤트는 분석 및 광고 재생 추적에 사용할 수 있습니다. VMAP (Video Multiple Ad Playlist)와 VAST (Video Ad Serving Template, 동영상 광고 게재 템플릿) 광고는 응답에서 제공된 모든 표준 추적 이벤트는 자동으로 SDK에 의해 전달됩니다.

이벤트 유형은 표 2에 50%에 도달할 수 있습니다.

</ph>

광고 삽입

Cast SDK를 사용하면 애플리케이션이 다양한 순간에 광고를 삽입하고 삭제할 수 있습니다. 설��할 수 있습니다. 광고 삽입에는 정적 및 동적의 두 가지 유형이 있습니다. 정��� 광고 삽입��� 사용하려면 LoadRequestData 플레이어 생성 전에 확인할 수 있습니다. 동적 광고 삽입은 BreakManager addBreak 이미 로드된 콘텐츠에 나누기를 삽입하는 API입니다. 각 삽입 유형 방법은 특정 광고 유형과 호환됩니다. 호환성 개요는 상호 운용성 매트릭스에서 제공됩니다.

정적 광고 삽입

정적 광고 삽입의 특징은 동영상 앞에 관련 광고 메타데이터를 추가하는 것입니다. 플레이어 생성에 기여했습니다. 이 정보는 MediaInformation 드림 (LoadRequestData) 예를 들어 연결된 발신자의 웹 수신기 애플리케이션에 의해 삽입될 수 있으며, LOAD 요청 가로채기 LoadRequestData가 웹 수신기 SDK를 사용하면 플레이어가 생성됩니다. 더보기: 미디어를 로드하는 방법을 보여줍니다. 샘플 아래는 LOAD 요청에 추가된 수동 고객 연결 광고를 보여줍니다. 인터셉터입니다.

const context = cast.framework.CastReceiverContext.getInstance();
const playerManager = context.getPlayerManager();

playerManager.setMessageInterceptor(
    cast.framework.messages.MessageType.LOAD, loadRequestData => {

  // Create the BreakClip.
  let clipClient = new cast.framework.messages.BreakClip('bc_client');
  clipClient.title = 'The Ad Title to be displayed during playback';
  clipClient.contentId = 'https://example.com/ad.mp4';
  clipClient.contentType = 'video/mp4';

  // Create the Break using the BreakClip id above.
  let breakPostrollClient = new cast.framework.messages.Break(
      'break_postroll_client', ['bc_client'], -1);

  // Set the ad information in the load request data.
  let media = loadRequestData.media;
  media.breakClips = [clipClient];
  media.breaks = [breakPostrollClient];

  return loadRequestData;
});

동적 광고 삽입

동적 광고 삽입은 콘텐츠 중간에 광고 시점을 설정하는 것이 특징입니다. 있습니다. BreakManager의 인스턴스를 가져오고 다음을 호출하여 이 작업을 실행합니다. addBreak API에 액세스할 수 있습니다. 이를 위해서는 최소한 두 개의 매개변수가 필요합니다. 삽입된 펼침 Break 및 배열 BreakClip 선택사항인 세 번째 속성이 포함되어 변경사항을 강제로 true로 설정된 경우 MediaStatus 브로드캐스트를 통해 연결된 발신자. 날짜 브레이크 클립 추가 시 해당 ID는 고유해야 합니다. 이 광고 플레이어가 생성된 후에만 추가할 수 있습니다. 웹 수신기 SDK 실행 PLAYER_LOADING 드림 이벤트를 수신합니다. 아래 샘플에서 스트림의 ID3 메타데이터 변경에 응답하는 이벤트 핸들러와 Break 및 BreakClip 객체를 만들어 타임라인에 삽입합니다.

const context = cast.framework.CastReceiverContext.getInstance();
const playerManager = context.getPlayerManager();
const breakManager = playerManager.getBreakManager();

playerManager.addEventListener(cast.framework.events.EventType.ID3, (event) => {

  // Create the BreakClip.
  let clipEmbeddedExpanded = parseBreakClipFromData(event.segmentData);
  let breakEmbeddedExpanded = parseExpandedBreakFromData(event.segmentData);

  // Add the break and break clip.
  breakManager.addBreak(breakEmbeddedExpanded, [clipEmbeddedExpanded]);
});

동적 광고 삭제

동적 광고 시점을 삭제하려면 애플리케이션에서 removeBreakById 드림 표시됩니다. 함수는 브레이크의 문자열 식별자를 받아들여 타임라인에서 삭제됩니다. 지정된 breakId는 삽입된 확장 광고 시점을 선택합니다. 다른 유형의 광고 시점이 감지되면 타임라인에 남아 있게 됩니다 휴식 시간을 삭제하는 아래 샘플을 참고하세요.

const context = cast.framework.CastReceiverContext.getInstance();
const playerManager = context.getPlayerManager();
const breakManager = playerManager.getBreakManager();

breakManager.removeBreakById('break_midroll_embedded_expanded');

광고 시점 동작

SDK는 플레이어가 들어오고 나갈 때의 기본 동작을 정의합니다. Google에서 제공하는 일부 API를 사용하여 이를 추가로 맞춤설정할 수 있는 방법을 제공합니다. 인치 BreakManager

기본 광고 시점 동작

일반 재생을 통해 또는 Break를 탐색하여 Break가 입력되면 SDK는 사용자가 이미 광고를 보았는지 여부를 isWatched 속성 만들어질 때 이 속성의 휴식 시간 기본값은 false입니다. 만약 속성이 true인 경우, 기본 시점에 들어가면 브레이크가 재생되지 않습니다. 콘텐츠는 계속 재생됩니다. 속성이 false인 경우 나누기는 다음과 같습니다. 입력하면 재생됩니다.

과거 시점을 찾을 때 기본 구현은 모든 Break를 가져옵니다. position가 찾기 작업의 seekFrom 및 seekTo 값으로 사용됩니다. 이 광고 시점 목록에서 SDK는 position가 있는 Break를 재생합니다. seekTo 값과 가장 가까우며 isWatched 속성이 다음과 같이 설정됩니다. false입니다. 그러면 광고 시점의 isWatched 속성이 true로 설정되고 브레이크 클립이 재생되기 시작합니다. 휴식 시간을 시청하면 기본 콘텐츠가 seekTo 위치에서 재생을 다시 시작합니다. 그렇지 않은 경우 브레이크가 있으면 브레이크가 재생되지 않고 기본 콘텐츠가 다시 시작됩니다. seekTo 위치에서 재생됩니다.

브레이크 재생 중에 SDK는 연결된 애플리케이션 내 MediaStatus 이러한 애플리케이션은 브로드캐스트를 사용하여 광고의 UI를 breakStatus 드림 속성 이 속성은 광고 시점 재생 중에만 정의됩니다.

또한 수신기 애플리케이션은 BreakClip의 현재 시간을 기준으로 한 플레이헤드의 위치 PlayerManager를 호출하여 표시됨 getBreakClipCurrentTimeSec 마찬가지로 애플리케이션은 다음과 같이 현재 BreakClip의 지속 시간을 쿼리할 수 있습니다. 통화 getBreakClipDurationSec

맞춤 광고 시점 동작

기본 동작 를 사용하여 수정할 수 있습니다. setBreakClipLoadInterceptor 및 setBreakSeekInterceptor BreakManager에 제공된 메서드

Break 탐색 인터셉터

브레이크 탐색 인터셉터를 사용하면 앱이 탐색 동작을 제어할 수 있습니다. 설정할 수 있습니다 이 함수는 찾기 작업이 요청될 때 트리거됩니다. 하나 이상의 휴식 시간에 앞으로 또는 뒤로 탐색합니다. 호출되면 BreakSeekData 드림 콜백 함수에 매개변수로 전달됩니다. BreakSeekData 객체 다음과 같은 배열을 포함합니다. Break position 속성이 현재 다음과 같이 정의된 플레이헤드 시간 seekFrom 탐색 목적지 시간은 seekTo를 탭합니다.

이 인터셉터를 사용하면 각 중단의 Break 객체가 다음과 같이 될 수 있습니다. 수정됨 브레이크 탐색 인터셉터가 구현되면 어떤 광고를 표시할지 지정해야 합니다. 선택적으로 수정된 BreakSeekData 객체를 반환하여 재생할 시점을 선택합니다. 이 플레이어는 반환 값에 포함된 모든 광고 시점을 재생합니다. 값이 null이거나 브레이크 탐색 인터셉터에서 아무것도 반환되지 않으면 브레이크는 건너뛰었습니다.

인터셉터의 간단한 구현은 아래 샘플을 참고하세요. 는 기본 동작을 재정의하여 이미 시청한 광고 시간을 제외할 수 있습니다

const context = cast.framework.CastReceiverContext.getInstance();
const playerManager = context.getPlayerManager();
const breakManager = playerManager.getBreakManager();

breakManager.setBreakSeekInterceptor((breakSeekData) => {

  // Filter the breaks array by removing watched breaks.
  const unwatchedBreaks =
      breakSeekData.breaks.filter(adBreak => !adBreak.isWatched);
  breakSeekData.breaks = unwatchedBreaks;

  return breakSeekData;
});

브레이크 클립 로드 인터셉터

브레이크 클립 로드 인터셉터를 사용하면 BreakClip 객체를 수정할 수 있습니다. 90%가 발생합니다.

브레이크 클립 로드 인터셉터는 스티칭된 타임라인 시점 kubectl run 명령어를 사용하여 setBreakClipLoadInterceptor Break를 입력하기 전에 이 인터셉터는 각 개인에 대해 한 번씩 호출됩니다. 해당 광고 시점에 정의된 BreakClip입니다. SDK는 원래 BreakClip 드림 객체를 콜백 함수의 매개변수로 전달합니다. 그러면 애플리케이션은 이 BreakClip를 가져오고 SDK가 브레이크를 가져와 표시할 수 있도록 반환합니다. 클립이 생성됩니다. null이거나 아무것도 반환되지 않은 경우 나누기는 건너뛸 수 있습니다

브레이크 클립의 contentUrl를 다음과 같이 수정하는 예는 아래를 참고하세요. 유틸리티 함수 호출 getUrlFromClipId. 여기서 BreakClip의 id입니다. URL에 매핑됩니다.

const context = cast.framework.CastReceiverContext.getInstance();
const playerManager = context.getPlayerManager();
const breakManager = playerManager.getBreakManager();

breakManager.setBreakClipLoadInterceptor(
    (breakClip, breakClipLoadInterceptorContext) => {

  // Obtains the URL of a break clip id from a function call.
  breakClip.contentUrl = getUrlFromClipId(breakClip.id);

  return breakClip;
});

광고 건너뛰기

Web Receiver SDK는 광고 시점 및 개별 광고 시간 클립을 건너뛰는 API를 제공합니다. 사용할 수 없습니다. 또한 SDK를 사용하면 사용자가 원하는 경우 보내는 사람 애플리케이션이나 스마트 디스플레이 기기와 상호작용하는 경우가 일반적입니다

사용자가 건너뛸 수 있는 광고 시간 클립

광고 시점 클립을 건너뛸 수 있는 것으로 설정하면 연결된 발신자와 상호작용할 수 있습니다. 스마트 디스플레이 기기를 사용하면 선택적으로 광고의 나머지 부분을 건너뛸 수 있으며 현재 재생 중인 광고 시점 클립입니다. 설정 whenSkippable 드림 속성을 음수가 아닌 초로 설정하면 BreakClip 객체. 재생 시간이 완료되면 플레이어는 광고 시간 클립을 건너뛸 수 있는 것으로 간주합니다. 브레이크 클립이 해당 시간(초) 동안 재생되었는지 확인합니다. 이 값을 0(으)로 설정 를 사용하면 사용자가 브레이크 클립을 즉시 건너뛸 수 있습니다.

// Create the BreakClip.
let clip = new cast.framework.messages.BreakClip('bc');
clip.title = 'The Ad Title to be displayed during playback';
clip.whenSkippable = 10; // Users can skip the clip after 10 seconds of playback.

이 정보는 발신자의 원래 로드 요청 또는 수신하기만 하면 됩니다. 건너뛰면 연결된 타임라인 광고 시점의 광고 시점 클립이 포함됩니다. 현재 브레이크 클립 재생을 중지합니다. 플레이어는 다음 클립이 있는 경우 중단하거나 기본 콘텐츠를 로드합니다. 건너뛰면 동영상의 브레이크 클립이 삽입된 타임라인 광고 시점은 광고 시점 클립의 끝부분을 탐색합니다. 해당 지점에서 스트림을 계속 재생할 수 있습니다.

프로그래매틱 방식으로 광고 건너뛰기

사용자 상호작용 없이도 광고를 자동으로 건너뛸 수 있습니다.

전체 휴식 시간이 재생되지 않도록 하려면 애플리케이션이 isWatched Break의 속성을 true로 변경합니다. 로드 중에 언제든지 이 작업을 수행할 수 있습니다. 시퀀스 또는 콘텐츠 재생입니다. isWatched 속성은 메인 콘텐츠의 현재 시간에서 휴식 시간의 position가 충족되면 플레이어를 반환합니다. 위치 플레이어가 광고 시간을 입력할지 여부를 결정합니다. 모든 광고 시점을 순환하고 값을 반환합니다.

const context = cast.framework.CastReceiverContext.getInstance();
const playerManager = context.getPlayerManager();
const breakManager = playerManager.getBreakManager();

playerManager.addEventListener(cast.framework.events.EventType.PLAYER_LOADING,
    (event) => {

  // Obtain the breaks and iterate through each item to skip all ad breaks.
  let breaks = breakManager.getBreaks();
  breaks.forEach((brk) => {
    brk.isWatched = true;
  });
});

특정 광고 시점 클립을 프로그래매틱 방식으로 건너뛰려면 브레이크 클립 로드 인터셉터를 사용해야 합니다. 작성자: null를 반환하거나 콜백 함수에서 값을 반환하지 않는 경우 건너뛸 수 있게 됩니다.

const context = cast.framework.CastReceiverContext.getInstance();
const playerManager = context.getPlayerManager();
const breakManager = playerManager.getBreakManager();

breakManager.setBreakClipLoadInterceptor(
      (breakClip, breakClipLoadInterceptorContext) => {
  return null;
});