Bu sayfa, Cloud Translation API ile çevrilmiştir.

IMA DAI SDK'sını kullanmaya başlama

IMA SDK'ları, multimedya reklamları web sitelerinize ve uygulamalarınıza entegre etmeyi kolaylaştırır. IMA SDK'ları, VAST ile uyumlu herhangi bir reklam sunucusundan reklam isteyebilir ve uygulamalarınızda reklam oynatmayı yönetebilir. IMA DAI SDK'ları ile uygulamalar, reklam ve içerik videosu (VOD veya canlı içerik) için bir yayın isteği gönderir. Ardından SDK, birleştirilmiş bir video akışı döndürür. Böylece uygulamanızda reklam ve içerik videosu arasında geçiş yapmanıza gerek kalmaz.

İlgilendiğiniz DAI çözümünü seçin

Google Cloud Video Birleştirici API'sine kayıtlı seç-izle yayınları oynatma

Bu kılavuzda, Google Cloud VOD yayın oturumu isteğinde bulunmak ve oynatmak için HTML5 için IMA DAI SDK'sının nasıl kullanılacağı gösterilmektedir.

Bu kılavuzda, IMA DAI ile ilgili Başlangıç kılavuzundaki temel örnek daha ayrıntılı olarak ele alınmaktadır.

Diğer platformlarla entegrasyon veya IMA istemci tarafı SDK'larını kullanma hakkında bilgi edinmek için Interactive Media Ads SDK'ları başlıklı makaleyi inceleyin.

Tamamlanmış bir örnek entegrasyonu görüntülemek veya takip etmek için HLS veya DASH için Cloud video birleştirme örneğini indirin.

Google Cloud projesi oluşturun

Bir Google Cloud projesi oluşturun ve hizmet hesaplarını projeye erişecek şekilde yapılandırın.

IMA SDK'sında kullanmak için aşağıdaki değişkenleri girin:

Konum

Seç-izle yapılandırmanızın oluşturulduğu Google Cloud bölgesi: LOCATION

Proje numarası

Video Stitcher API'yi kullanan Google Cloud proje numarası: PROJECT_NUMBER

OAuth jetonu

Video Birleştirici kullanıcı rolüne sahip bir hizmet hesabının kısa süreli OAuth jetonu:

OAUTH_TOKEN

Kısa süreli OAuth jetonları oluşturma hakkında daha fazla bilgi edinin. OAuth jetonu, süresi dolmadığı sürece birden fazla istekte yeniden kullanılabilir.

Ağ kodu

Reklam isteğinde bulunmak için Ad Manager ağ kodu: NETWORK_CODE

VOD yapılandırma kimliği

VOD yayını için VOD yapılandırma kimliği: VOD_CONFIG_ID

VOD yapılandırma kimliği oluşturma hakkında daha fazla bilgiyi Cloud Stitching'de VOD yapılandırması oluşturma kılavuzunda bulabilirsiniz.

Geliştirme ortamı yapılandırma

IMA örnek uygulamaları yalnızca HLS yayın isteklerini gösterir. VideoStitcherVodStreamRequest sınıfını oluştururken DASH akışlarını kullanmaya devam edebilirsiniz. DASH uyumlu oynatıcınızı ayarlarken video oynatıcınızın ilerleme etkinlikleri için StreamManager.processMetadata()'a videonun meta verilerini sağlayabilecek bir dinleyici ayarlamanız gerekir. Bu işlev üç parametre alır:

type: HLS akışları için 'ID3', DASH akışları için 'urn:google:dai:2018' olarak ayarlanması gereken bir dize.
data: DASH etkinlik mesajları için bu, mesaj veri dizesidir.
timestamp: DASH akışları için etkinlik mesajı başlangıç zamanı olan bir sayı.

Meta verileri, oyuncu etkinliklerinizin sağlayabileceği en kısa sürede ve en sık şekilde gönderin. Meta veriler eksikse veya doğru değilse IMA DAI SDK'sı reklam etkinliklerini tetiklemeyebilir. Bu da reklam etkinliklerinin yanlış raporlanmasına neden olur.

HTML5 için IMA DAI örneklerini indirin ve hls_js/simple örnek zip dosyasını yeni bir klasöre çıkarın. Bu örnek, test amacıyla yerel olarak barındırabileceğiniz bir web uygulamasıdır.

Örneği yerel olarak barındırmak için yeni klasöre gidin ve web sunucusu başlatmak üzere aşağıdaki Python komutunu çalıştırın:

python3 -m http.server 8000

http.server yalnızca Python 3.x sürümlerinde kullanılabilir. Apache HTTP Server veya Node JS gibi başka bir web sunucusu kullanabilirsiniz.

Bir web tarayıcısı açıp video oynatıcıyı görmek için localhost:8000 adresine gidin. Tarayıcınız HLS.js kitaplığını desteklemelidir.

Her şey düzgün çalışıyorsa video oynatıcıdaki oynat düğmesini tıkladığınızda "Tears of Steel" kısa filmi başlar ve her 30 saniyede bir reklam arası gösterilir.

Seç-izle akışı isteme

Sana Özel akışını, reklam yerleştirilmiş seç-izle akışınızla değiştirmek için Google Ad Manager ile otomatik olarak reklam oturumu oluşturmak üzere VideoStitcherVodStreamRequest sınıfını kullanın. İzleme ve hata ayıklama için oluşturulan DAI oturumlarını bulmak üzere Google Ad Manager kullanıcı arayüzünü kullanabilirsiniz.

Mevcut örnekte, VOD akışı veya canlı yayın isteme işlevleri vardır. Bu işlevin Google Cloud Video Stitcher API ile çalışmasını sağlamak için VideoStitcherVodStreamRequest nesnesi döndürecek yeni bir işlev eklemeniz gerekir.

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

// StreamManager which will be used to request DAI streams.
let streamManager;
...

function initPlayer() {
  videoElement = document.getElementById('video');
  adUiElement = document.getElementById('adUi');
  streamManager = new google.ima.dai.api.StreamManager(
    videoElement,
    adUiElement
  );
  streamManager.addEventListener(
    [
      google.ima.dai.api.StreamEvent.Type.LOADED,
      google.ima.dai.api.StreamEvent.Type.ERROR,
      google.ima.dai.api.StreamEvent.Type.AD_BREAK_STARTED,
      google.ima.dai.api.StreamEvent.Type.AD_BREAK_ENDED
    ],
    onStreamEvent, false);

  hls.on(Hls.Events.FRAG_PARSING_METADATA, function(event, data) {
    if (streamManager && data) {
      // For each ID3 tag in our metadata, we pass in the type - ID3, the
      // tag data (a byte array), and the presentation timestamp (PTS).
      data.samples.forEach(function(sample) {
        streamManager.processMetadata('ID3', sample.data, sample.pts);
      });
    }
  });

  videoElement.addEventListener('pause', () => {
    playButton.style.display = "block";
  });

  playButton.addEventListener('click', initiatePlayback);
}

function initiatePlayback() {
  requestVodVideoStitcherStream();

  playButton.style.display = "none";
  playButton.removeEventListener('click', initiatePlayback);
  playButton.addEventListener('click', resumePlayback);
}
...
function requestVodVideoStitcherStream() {
  const streamRequest = new google.ima.dai.api.VideoStitcherVodStreamRequest();
  streamRequest.vodConfigId = 'VOD_CONFIG_ID';
  streamRequest.region = 'LOCATION';
  streamRequest.projectNumber = 'PROJECT_NUMBER';
  streamRequest.oAuthToken = 'OAUTH_TOKEN';
  streamRequest.networkCode = 'NETWORK_CODE';

  streamManager.requestStream(streamRequest);
}

Sayfayı tekrar yükleyin. Ardından, özel seç-izle akışı isteyebilir ve oynatabilirsiniz.

(İsteğe bağlı) Yayın oturumu seçenekleri ekleme

VideoStitcherVodStreamRequest.videoStitcherSessionOptions kullanarak varsayılan Cloud Video Stitcher API yapılandırmasını geçersiz kılmak için oturum seçenekleri ekleyerek aktarma isteğinizi özelleştirin. Tanınmayan bir seçenek sağlarsanız Cloud Video Stitcher API, HTTP 400 hatasıyla yanıt verir. Yardım için sorun giderme kılavuzuna bakın.

Örneğin, aşağıdaki kod snippet'ini kullanarak manifest seçeneklerini geçersiz kılabilirsiniz. Bu kod snippet'i, en düşük bit hızından en yüksek bit hızına göre sıralanmış yayınlar içeren iki yayın manifest'i ister.

...

// The following session options are examples. Use session options
// that are compatible with your video stream.
streamRequest.videoStitcherSessionOptions = {
  "manifestOptions": {
    "includeRenditions": [
      {"bitrateBps": 3000, "codecs": "hvc1.1.4.L126.B0, mp4a.40.2"},
      {"bitrateBps": 2000, "codecs": "avc1.64001f, mp4a.40.2"},
    ],
    "bitrateOrder": "ascending"
  }
};

streamManager.requestStream(streamRequest);

Temizleme

Google Cloud Video Stitcher API'yi kullanarak bir VOD akışını başarıyla barındırdığınıza ve HTML5 için IMA DAI SDK'sını kullanarak istek gönderdiğinize göre, tüm yayınlama kaynaklarını temizlemeniz önemlidir.

Gereksiz kaynakları ve öğeleri kaldırmak için Seç-izle içeriğini temizleme kılavuzunu uygulayın.

Son olarak, Python 3 web sunucusunu başlattığınız terminal penceresinde yerel sunucuyu sonlandırmak için ctrl+C komutunu kullanın.