Doğrusal DAI akışlarında zamanlanmış meta verileri işleme

Interactive Media Ads (IMA) Dinamik Reklam Ekleme (DAI) SDK'sı Akışın medya segmentlerine yerleştirilmiş meta veri bilgileri (bant içi meta veriler), veya manifest dosyasında (manifest meta verisi) bulunan ve istemci taraflı reklam etkinliklerini kontrol edin. Meta veriler farklı biçimlerde gönderilir. değişebiliyor.

Video oynatıcı, zamanlanmış meta verileri toplu olarak alır. Oynatıcıya bağlı olarak meta veriler planlanan zamanda ya da gruplar halinde gösterilebilir. Her bir meta veri dize, ne zaman olması gerektiğini belirten bir sunu zaman damgası (PTS) içeriyor. tetiklendi.

Meta verileri yakalamak ve bunları IMA DAI SDK'sına yönlendirmek uygulamanızın sorumluluğundadır. SDK, bu bilgileri iletmek için aşağıdaki yöntemleri sunar:

onTimedMetadata

Bu yöntem, işlenmeye hazır olan meta veri dizelerini SDK'dır. Tek bir bağımsız değişken gerekir:

  • metadata: İlişkilendirilmiş bir dizeyle birlikte TXXX anahtarını içeren nesne değeri google_ olmalıdır.
processMetadata

Bu yöntem, PTS Aşağıdaki bağımsız değişkenleri alır:

  • type: İşlenen etkinliğin türünü içeren bir dize. Kabul edildi değerler HLS için ID3 veya DASH için urn:google:dai:2018 şeklindedir
  • data: google_ ön ekine sahip bir dize değeri veya kod çözer.
  • timestamp: Verilerin işlenmesinin saniye cinsinden zaman damgasıdır.

IMA DAI SDK'sı tarafından desteklenen her akış türü, benzersiz bir zamanlanmış meta verileri için geçerlidir.

HLS MPEG2TS akış

MPEG2TS segmentlerini kullanan doğrusal DAI HLS akışları, zamanlanmış meta verileri Video oynatıcıya, bant içi ID3 etiketleriyle. Bu ID3 etiketleri, MPEG2TS segmentlerini içerir ve TXXX alan adı verilir (özel kullanıcı tanımlı metin için içerik).

Safari'de oynat

Safari, ID3 etiketlerini otomatik bir şekilde, gizli bir kanal olarak işler. Bu nedenle, işaret değişikliği etkinlikleri doğru zamanda tetiklenmesini sağlamak anlamına gelir. Geçebilir Tüm meta verileri, içerik veya türe bakılmaksızın IMA DAI SDK'sına gönderebilirsiniz. İlgisiz meta veriler otomatik olarak filtrelenir.

Aşağıda bununla ilgili bir örnek verilmiştir:

videoElement.textTracks.addEventListener('addtrack', (e) => {
  const track = e.track;
  if (track.kind === 'metadata') {
    track.mode = 'hidden';
    track.addEventListener('cuechange', () => {
      for (const cue of track.activeCues) {
        const metadata = {};
        metadata[cue.value.key] = cue.value.data;
        streamManager.onTimedMetadata(metadata);
      }
    });
  }
});
...

HLS.js

HLS.js, ID3 etiketlerini FRAG_PARSING_METADATA etkinliği üzerinden toplu olarak sağlar. hesaplamanız gerekir. HLS.js, bayt dizilerinden ID3 verilerini çevirmez dizelere karşılık gelir ve etkinlikleri karşılık gelen PTS'ye dengelemez. Hayır örnek verilerin kodunu bayt dizisinden dizeye çözmek veya filtrelemek için gereklidir. IMA DAI SDK'sı bu kod çözme ve filtrelemeyi gerçekleştirdiğinden, alakasız ID3 etiketleri otomatik olarak oluşturur.

Aşağıda bununla ilgili bir örnek verilmiştir:

hls.on(Hls.Events.FRAG_PARSING_METADATA, (e, data) => {
  if (streamManager && data) {
    data.samples.forEach((sample) => {
      streamManager.processMetadata('ID3', sample.data, sample.pts);
    });
  }
});
...

HLS CMAF akışları

Ortak Medya Uygulama Çerçevesi (CMAF) geçişini kullanan doğrusal DAI HLS akışları ID3 - CMAF standardı. Bu eMSG kutuları her medya segmentinin başına yerleştirilir ve her ID3 eMSG şunları içerir: akıştaki son kesintiye göre bir PTS.

HLS.js'nin 1.2.0 sürümünden itibaren, önerilen her iki oynatıcımız da ID3'ü geçmekte CMAF aracılığıyla, kullanıcıya ID3 etiketleri gibi. Bu nedenle, aşağıdaki örnekler, HLS MPEG2TS akışlarıyla aynıdır. Ancak bu, tüm oyuncular için geçerli olmayabilir, bu nedenle HLS CMAF desteğinin uygulanması akışlar, eMSG üzerinden ID3'ü ayrıştırmak için benzersiz kod gerektirebilir.

Safari'de oynat

Safari, eMSG meta verileri aracılığıyla ID3'ü gerçek ID3 etkinlikleri olarak değerlendirir ve bunları otomatik bir şekilde gizli bir kanal gibi görürsünüz. Örneğin, işaret değişikliği etkinlikleri doğru zamanda tetiklenmesini sağlar. Bu videoda tüm meta verileri IMA DAI SDK'sına iletmenize olanak tanır. Herhangi biri DAI ile ilgili olmayan meta veriler otomatik olarak filtrelenir.

Aşağıda bununla ilgili bir örnek verilmiştir:

videoElement.textTracks.addEventListener('addtrack', (e) => {
  const track = e.track;
  if (track.kind === 'metadata') {
    track.mode = 'hidden';
    track.addEventListener('cuechange', () => {
      for (const cue of track.activeCues) {
        const metadata = {};
        metadata[cue.value.key] = cue.value.data;
        streamManager.onTimedMetadata(metadata);
      }
    });
  }
});
...

HLS.js

1.2.0 sürümünden itibaren HLS.js, eMSG meta verileri aracılığıyla ID3'ü sözde kimlik3 olarak işlemektedir FRAG_PARSING_METADATA etkinliği aracılığıyla bu etkinlikleri toplu olarak sağlar. hesaplamanız gerekir. HLS.js, bayt dizilerinden ID3 verilerini çevirmez . Hayır gereken kod çözme işlemini otomatik olarak gerçekleştirir.

Aşağıda bununla ilgili bir örnek verilmiştir:

hls.on(Hls.Events.FRAG_PARSING_METADATA, (e, data) => {
  if (streamManager && data) {
    data.samples.forEach((sample) => {
      streamManager.processMetadata('ID3', sample.data, sample.pts);
    });
  }
});
...

DASH akışları

Doğrusal DAI DASH akışları, meta verileri özel schemeIdUri değeri urn:google:dai:2018. Bu etkinliklerdeki her metin yükü ve PTS içerir.

DASH.js

Dash.js, her bir öğenin schemaIdUri değerinden sonra adlandırılmış özel etkinlik işleyiciler sağlar Etkinlik akışı. Bu özel işleyiciler gruplar halinde etkinleşir ve etkinliği doğru şekilde zamanlayabilmek için PTS değerini işleyin. IMA DAI SDK'sı, StreamManager yöntemiyle processMetadata() bunu sizin için yapabilirsiniz.

Aşağıda bununla ilgili bir örnek verilmiştir:

const dash = dashjs.MediaPlayer().create();
dash.on('urn:google:dai:2018', (payload) => {
  const mediaId = payload.event.messageData;
  const pts = payload.event.calculatedPresentationTime;
  streamManager.processMetadata('urn:google:dai:2018', mediaId, pts);
});
...

Shaka Oynatıcı

Shaka Player, timelineregionenter etkinliği kapsamında etkinlikleri gösteriyor. Teslim tarihi biçimlendirme uyumsuzluğuna neden olursa, meta veri değeri details özelliğiyle ham alındı eventElement.attributes['messageData'].value

Aşağıda bununla ilgili bir örnek verilmiştir:

player.addEventListener('timelineregionenter', function(event) {
  const detail = event.detail;
  if ( detail.eventElement.attributes &&
       detail.eventElement.attributes['messageData'] &&
       detail.eventElement.attributes['messageData'].value) {
    const mediaId = detail.eventElement.attributes['messageData'].value;
    const pts = detail.startTime;
    streamManager.processMetadata("urn:google:dai:2018", mediaId, pts);
  }
});
...

Kapsül yayınlama

Kapsül yayınlamada, zamanlanmış aktarım için farklı yapılandırmalar vardır. meta verileri kullanır.

  • Canlı veya VOD yayın türü
  • HLS veya DASH akış biçimi
  • Kullanılan oynatıcının türü
  • Kullanılan DAI arka ucunun türü

HLS akış biçimi (Canlı ve VOD akışları, HLS.js oynatıcısı)

HLS.js oynatıcısı kullanıyorsanız şunu dinleyin: HLS.js FRAG_PARSING_METADATA etkinliğini kullanarak ID3 meta verilerini almak ve StreamManager.processMetadata() sürümüne sahip SDK.

Her şey yüklendikten sonra videoyu otomatik olarak oynatmak için şunu dinleyin: Oynatmayı tetiklemek için HLS.js MANIFEST_PARSED etkinliğini kullanın.

function loadStream(streamID) {
  hls.loadSource(url);
  hls.attachMedia(videoElement);
  
  // Timed metadata is passed HLS stream events to the streamManager.
  hls.on(Hls.Events.FRAG_PARSING_METADATA, parseID3Events);
  hls.on(Hls.Events.MANIFEST_PARSED, startPlayback);
}

function parseID3Events(event, data) {
  if (streamManager && data) {
    // For each ID3 tag in the metadata, pass in the type - ID3, the
    // tag data (a byte array), and the presentation timestamp (PTS).
    data.samples.forEach((sample) => {
      streamManager.processMetadata('ID3', sample.data, sample.pts);
    });
  }
}

function startPlayback() {
  console.log('Video Play');
  videoElement.play();
}

DASH.js (DASH akış biçimi, Canlı ve VOD akış türü)

DASH.js oynatıcı kullanıyorsanız Canlı veya seç-izle videolar için ID3 meta verilerini dinlemek üzere farklı dizeler kullanmanız gerekir. akışlar:

  • Canlı yayınlar: 'https://developer.apple.com/streaming/emsg-id3'
  • VOD yayınları: 'urn:google:dai:2018'

ID3 meta verilerini StreamManager.processMetadata() ile SDK'ya iletin.

Her şey yüklenip hazır olduğunda video kontrollerini otomatik olarak göstermek için DASH.js MANIFEST_LOADED etkinliğini dinleyin.

const googleLiveSchema = 'https://developer.apple.com/streaming/emsg-id3';
const googleVodSchema = 'urn:google:dai:2018';
dashPlayer.on(googleLiveSchema, processMetadata);
dashPlayer.on(googleVodSchema, processMetadata);
dashPlayer.on(dashjs.MediaPlayer.events.MANIFEST_LOADED, loadlistener);

function processMetadata(metadataEvent) {
  const messageData = metadataEvent.event.messageData;
  const timestamp = metadataEvent.event.calculatedPresentationTime;

  // Use StreamManager.processMetadata() if your video player provides raw
  // ID3 tags, as with dash.js.
  streamManager.processMetadata('ID3', messageData, timestamp);
}

function loadlistener() {
  showControls();

  // This listener must be removed, otherwise it triggers as addional
  // manifests are loaded. The manifest is loaded once for the content,
  // but additional manifests are loaded for upcoming ad breaks.
  dashPlayer.off(dashjs.MediaPlayer.events.MANIFEST_LOADED, loadlistener);
}

Canlı yayınlarla Shaka Player (DASH akış biçimi)

Oyun için Shaka Player'ı meta veri etkinliklerini dinlemek için 'emsg' dizesini kullanın. Ardından, StreamManager.onTimedMetadata() için yaptığınız aramadaki etkinlik mesajı verilerini kullanın.

shakaPlayer.addEventListener('emsg', (event) => onEmsgEvent(event));

function onEmsgEvent(metadataEvent) {
  // Use StreamManager.onTimedMetadata() if your video player provides
  // processed metadata, as with Shaka player livestreams.
  streamManager.onTimedMetadata({'TXXX': metadataEvent.detail.messageData});
}

VOD akışlarına sahip Shaka Player (DASH akış biçimi)

Oyun için Shaka Player'ı VOD akışı oynatma, dinlemek için 'timelineregionenter' dizesini kullanın meta veri etkinlikleridir. Ardından, aramanızdaki etkinlik mesajı verilerini kullanarak StreamManager.processMetadata() 'urn:google:dai:2018' dizesi için.

shakaPlayer.addEventListener('timelineregionenter', (event) => onTimelineEvent(event));

function onTimelineEvent(metadataEvent) {
  const detail = metadataEvent.detail;
  if ( detail.eventElement.attributes &&
       detail.eventElement.attributes['messageData'] &&
       detail.eventElement.attributes['messageData'].value ) {
        const mediaId = detail.eventElement.attributes['messageData'].value;
        const pts = detail.startTime;
        // Use StreamManager.processMetadata() if your video player provides raw
        // ID3 tags, as with Shaka player VOD streams.
        streamManager.processMetadata('urn:google:dai:2018', mediaId, pts);
       }
}