شروع کنید

این راهنما نحوه پخش جریان DAI را با استفاده از IMA CAF DAI SDK نشان می‌دهد. اگر می‌خواهید نمونه یکپارچه‌سازی کامل‌شده را مشاهده یا دنبال کنید، نمونه را دانلود کنید .

قبل از استفاده از این راهنما، حتماً با پروتکل گیرنده وب Chromecast Application Framework آشنا شوید. این راهنما سطح اولیه آشنایی با مفاهیم گیرنده CAF، مانند رهگیرهای پیام و اشیاء اطلاعات رسانه ای ، و همچنین آشنایی با استفاده از ابزار فرمان و کنترل Cast را برای تقلید از فرستنده CAF در نظر می گیرد.

برای استفاده از IMA DAI، باید یک حساب Ad Manager 360 داشته باشید. اگر حساب Ad Manager دارید، برای جزئیات بیشتر با مدیر حساب خود تماس بگیرید. برای کسب اطلاعات در مورد ثبت نام در Ad Manager، از مرکز راهنمای Ad Manager دیدن کنید.

نمای کلی CAF DAI

پیاده سازی DAI با استفاده از IMA CAF DAI SDK شامل دو جزء اصلی است که در این راهنما نشان داده شده است:

  • StreamRequest : شیئی که یک درخواست جریان را به سرورهای تبلیغاتی Google تعریف می کند. StreamRequests در دو نوع اصلی وجود دارد:
    • LiveStreamRequest : یک کلید دارایی و یک کلید API اختیاری و همچنین سایر پارامترهای اختیاری را مشخص می کند.
    • VODStreamRequest : شناسه منبع محتوا ، شناسه ویدیو ، و یک کلید API اختیاری و همچنین سایر پارامترهای اختیاری را مشخص می کند.
  • StreamManager : شی‌ای که ارتباط بین جریان ویدئو و IMA DAI SDK را کنترل می‌کند، مانند شلیک پینگ‌های ردیابی و ارسال رویدادهای جریان به ناشر.

پیش نیازها

قبل از شروع به موارد زیر نیاز دارید:

  • یک حساب Cast Developer Console با یک دستگاه آزمایشی ثبت‌شده.
  • یک برنامه گیرنده وب میزبانی شده که در Cast Developer Console شما ثبت شده است و می توان آن را برای میزبانی کد ارائه شده توسط این راهنما تغییر داد.
  • یک برنامه ارسال که برای استفاده از برنامه گیرنده وب شما پیکربندی شده است. برای اهداف این مثال، ما از ابزار Cast Command and Control به عنوان فرستنده خود استفاده خواهیم کرد.

1. اشیاء MediaInfo فرستنده را پیکربندی کنید

ابتدا، شی MediaInfo برنامه فرستنده خود را طوری پیکربندی کنید که شامل فیلدهای زیر باشد:

شناسه محتوا یک شناسه منحصر به فرد برای این آیتم رسانه ای
contentUrl اگر DAI StreamRequest به هر دلیلی ناموفق بود، نشانی وب جریان بازگشتی بارگیری می‌شود
نوع جریان برای پخش‌های زنده، این مقدار باید روی «LIVE» تنظیم شود. برای جریان‌های VOD، این مقدار باید روی «BUFFERED» تنظیم شود
داده های سفارشی assetKey فقط پخش زنده پخش زنده مورد نظر را برای بارگیری شناسایی می کند
contentSourceId فقط جریان VOD. فید رسانه ای را که حاوی جریان درخواستی است شناسایی می کند.
شناسه ویدیو فقط جریان VOD. جریان درخواستی را در فید رسانه مشخص شده شناسایی می کند.
کلید ای پی ای یک کلید API اختیاری که می‌تواند برای بازیابی URL جریان از IMA DAI SDK مورد نیاز باشد.
senderCanSkip یک مقدار بولی که به گیرنده اطلاع می دهد که آیا دستگاه فرستنده توانایی نمایش دکمه پرش را دارد یا خیر، که پشتیبانی از تبلیغات قابل پرش را ممکن می کند.

برای پیکربندی این مقادیر در ابزار فرمان و کنترل Cast، روی تب "Load Media" کلیک کنید و نوع درخواست بار سفارشی را روی "LOAD" تنظیم کنید. سپس داده های JSON در ناحیه متن را با یکی از اشیاء JSON زیر جایگزین کنید:

زنده

{
  "media": {
    "contentId": "bbb",
    "contentUrl": "https://storage.googleapis.com/interactive-media-ads/media/bbb.m3u8",
    "streamType": "LIVE",
    "customData": {
      "assetKey": "sN_IYUG8STe1ZzhIIE_ksA",
      "ApiKey": "",
      "senderCanSkip": true
    }
  },
  "credentials": "testCredentials"
}

VOD

{
  "media": {
    "contentId": "tos",
    "contentUrl": "https://storage.googleapis.com/interactive-media-ads/media/tos.m3u8",
    "streamType": "BUFFERED",
    "customData": {
      "contentSourceId": "2528370",
      "videoId": "tears-of-steel",
      "ApiKey": "",
      "senderCanSkip": true
    }
  },
  "credentials": "testCredentials"
}

این شی درخواست بار سفارشی می تواند به گیرنده ارسال شود تا هر مرحله زیر را آزمایش کند

2. یک گیرنده اصلی CAF ایجاد کنید

با پیروی از راهنمای گیرنده اصلی CAF SDK، یک گیرنده وب پایه ایجاد کنید.

کد گیرنده شما باید به شکل زیر باشد:

<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>

3. IMA DAI SDK را وارد کنید و Player Manager را دریافت کنید

یک برچسب اسکریپت برای وارد کردن IMA DAI SDK برای CAF به گیرنده وب خود، درست پس از بارگیری اسکریپت CAF اضافه کنید. CAF DAI SDK همیشه سبز است، بنابراین نیازی به تنظیم نسخه خاصی نیست. سپس، در تگ اسکریپت زیر، زمینه گیرنده و مدیر پخش را قبل از شروع گیرنده به صورت ثابت ذخیره کنید.

<html>
<head>
  <script type="text/javascript"
      src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js"></script>
  <script src="//imasdk.googleapis.com/js/sdkloader/cast_dai.js"></script>
</head>
<body>
  <cast-media-player></cast-media-player>
  <script>
    const castContext = cast.framework.CastReceiverContext.getInstance();
    const playerManager = castContext.getPlayerManager();

    castContext.start();
  </script>
</body>
</html>

4. IMA Stream Manager را راه اندازی کنید

مدیر جریان CAF DAI SDK را راه‌اندازی کنید.

<html>
<head>
  <script type="text/javascript"
      src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js"></script>
  <script src="//imasdk.googleapis.com/js/sdkloader/cast_dai.js"></script>
</head>
<body>
  <cast-media-player></cast-media-player>
  <script>
    const castContext = cast.framework.CastReceiverContext.getInstance();
    const playerManager = castContext.getPlayerManager();
    const streamManager = new google.ima.cast.dai.api.StreamManager();

    castContext.start();
  </script>
</body>
</html>

5. رهگیر پیام بار را ایجاد کنید

CAF DAI SDK از رهگیر بارگذاری پیام CAF برای درخواست استریم و جایگزینی URL محتوا با جریان نهایی DAI استفاده می کند. رهگیر پیام streamManager.requestStream() را فراخوانی می‌کند، که تنظیمات وقفه‌های تبلیغاتی، درخواست جریان و جایگزینی محتوای URL موجود را انجام می‌دهد.

<html>
<head>
  <script type="text/javascript"
      src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js"></script>
  <script src="//imasdk.googleapis.com/js/sdkloader/cast_dai.js"></script>
</head>
<body>
  <cast-media-player></cast-media-player>
  <script>
    const castContext = cast.framework.CastReceiverContext.getInstance();
    const playerManager = castContext.getPlayerManager();
    const streamManager = new google.ima.cast.dai.api.StreamManager();

    const getStreamRequest = (request) => null;

    playerManager.setMessageInterceptor(
        cast.framework.messages.MessageType.LOAD, (request) => {
          return streamManager.requestStream(request, getStreamRequest(request))
              .then((request) => {
                this.broadcast('Stream request successful.');
                return Promise.resolve(request);
              })
              .catch((error) => {
                this.broadcast('Stream request failed.');
                return Promise.resolve(request);
              });
        });

    castContext.start();
  </script>
</body>
</html>

6. درخواست استریم را بسازید

برای تکمیل یکپارچه سازی CAF DAI خود، باید درخواست جریان خود را با استفاده از داده هایی که در شی mediaInfo از فرستنده گنجانده شده است، بسازید.

<html>
<head>
  <script type="text/javascript"
      src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js"></script>
  <script src="//imasdk.googleapis.com/js/sdkloader/cast_dai.js"></script>
</head>
<body>
  <cast-media-player></cast-media-player>
  <script>
    const castContext = cast.framework.CastReceiverContext.getInstance();
    const playerManager = castContext.getPlayerManager();
    const streamManager = new google.ima.cast.dai.api.StreamManager();

    const getStreamRequest = (request) => {
      const imaRequestData = request.media.customData;
      let streamRequest = null;
      if (imaRequestData.assetKey) {
        // Live stream
        streamRequest = new google.ima.cast.dai.api.LiveStreamRequest();
        streamRequest.assetKey = imaRequestData.assetKey;
      } else if (imaRequestData.contentSourceId) {
        // VOD stream
        streamRequest = new google.ima.cast.dai.api.VODStreamRequest();
        streamRequest.contentSourceId = imaRequestData.contentSourceId;
        streamRequest.videoId = imaRequestData.videoId;
      }
      if (streamRequest && imaRequestData.ApiKey) {
        streamRequest.ApiKey = imaRequestData.ApiKey;
      }
      if (streamRequest && imaRequestData.senderCanSkip) {
        streamRequest.senderCanSkip = imaRequestData.senderCanSkip;
      }
      return streamRequest;
    };

    playerManager.setMessageInterceptor(
        cast.framework.messages.MessageType.LOAD, (request) => {
          return streamManager.requestStream(request, getStreamRequest(request))
              .then((request) => {
                return Promise.resolve(request);
              })
              .catch((error) => {
                this.broadcast('Stream request failed.');
                return Promise.resolve(request);
              });
        });

    castContext.start();
  </script>
</body>
</html>

... و voila! اکنون می‌توانید با استفاده از CAF DAI SDK Google، جریان‌های DAI را درخواست و پخش کنید. برای آشنایی با ویژگی‌های پیشرفته‌تر SDK، به سایر راهنماها مراجعه کنید یا نمونه برنامه‌های گیرنده ما را دانلود کنید .