تبلیغات ویدیویی (Pre-roll)

اگر در صفحات خود پلیر ویدیو دارید، می‌توانید پیش از پخش ویدیوی اصلی یک تبلیغ ویدیویی (pre-roll) نمایش دهید. یکتانت تبلیغات ویدیویی را با استاندارد VAST سرو می‌کند: آدرس VAST جایگاه ویدیویی خود را به پلیرتان می‌دهید و پلیر تبلیغ را پخش می‌کند.

آدرس VAST

GET https://jamssp.yektanet.com/api/v1/load/{POSITION_ID}

{POSITION_ID} شناسه‌ی جایگاه ویدیویی شماست و آدرس کامل آن در پنل ناشر نمایش داده می‌شود. پاسخ مستقیماً یک سند VAST XML است. اگر تبلیغی موجود نباشد، یک VAST خالی (<VAST/>) برمی‌گردد و پلیر باید مستقیماً ویدیوی اصلی را پخش کند.

پارامتر (query)	توضیح
w	عرض صفحه‌ی نمایش به پیکسل (اختیاری).
h	ارتفاع صفحه‌ی نمایش به پیکسل (اختیاری).
requestId	شناسه‌ی یکتای درخواست (اختیاری).
is_debug_request	در تست true بگذارید تا هزینه و درآمد ثبت نشود.

آدرس را مستقیم به پلیر بدهید

پاسخ این آدرس خودِ VAST XML است، نه JSON. آن را با fetch نخوانید؛ آدرس را به‌عنوان ad tag به پلیر بدهید تا پلیر درخواست را از مرورگر کاربر بفرستد و رویدادهای VAST (impression، quartileها، کلیک) را خودش فراخوانی کند.

Video.js

با پلاگین videojs-ima:

<link href="https://vjs.zencdn.net/7.21.0/video-js.css" rel="stylesheet" />
<script src="https://vjs.zencdn.net/7.21.0/video.min.js"></script>
<script src="https://imasdk.googleapis.com/js/sdkloader/ima3.js"></script>
<script src="https://cdn.jsdelivr.net/npm/videojs-contrib-ads@6.9.0/dist/videojs.ads.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/videojs-ima@1.9.0/dist/videojs.ima.min.js"></script>

<video id="my-video" class="video-js" controls preload="auto" width="640" height="360">
  <source src="https://example.com/main-video.mp4" type="video/mp4" />
</video>

<script>
  const player = videojs('my-video');
  player.ima({
    id: 'my-video',
    adTagUrl: 'https://jamssp.yektanet.com/api/v1/load/{POSITION_ID}',
  });
  player.on('ready', () => player.ima.initializeAdDisplayContainer());
</script>

JW Player

<script src="https://cdn.jwplayer.com/libraries/{YOUR_LIBRARY_KEY}.js"></script>
<div id="my-video-player"></div>

<script>
  jwplayer('my-video-player').setup({
    file: 'https://example.com/main-video.mp4',
    advertising: {
      client: 'vast',
      schedule: {
        adbreak1: {
          offset: 'pre',
          tag: 'https://jamssp.yektanet.com/api/v1/load/{POSITION_ID}',
        },
      },
    },
  });
</script>

پلیرهای دیگر

هر پلیری که VAST 3 را پشتیبانی کند قابل استفاده است. اگر پلیر شما VAST را پشتیبانی نمی‌کند، می‌توانید با کتابخانه‌ی vast-client-js پاسخ را پردازش و رویدادها را خودتان فراخوانی کنید.