VAST 4.0
Стандарт IAB для встраивания видеорекламы в любой плеер. У каждого нашего видео-блока есть VAST URL, понимают JW Player / video.js / IMA SDK / HLS.js / Plyr.
Содержание
1. Что такое VAST
VAST (Video Ad Serving Template) - стандарт IAB для передачи метаданных видеорекламы от рекламного сервера к плееру. Версия 4.0 - актуальная.
Работает так:
- Перед основным контентным видео плеер дёргает VAST URL
- Получает XML с описанием рекламы: где лежит mp4, длительность, через сколько секунд можно skip, куда вести по клику
- Играет рекламу (pre-roll)
- Шлёт impression-tracking pixel что показ засчитан
- Включает основное видео
Преимущество перед нашим JS-виджетом: работает в твоём существующем плеере. Не нужно ничего переделывать в UI.
2. Где взять VAST URL
VAST-формат доступен только для блоков формата video (in-stream 16:9). На странице блока /pub/zones/{id} увидишь розовую плашку «🎬 VAST URL - для своего видеоплеера»:
https://sladu.net/vast/{subid}.xml
Пример: https://sladu.net/vast/tvid9234f7.xml
3. Структура VAST-ответа
<?xml version="1.0" encoding="UTF-8"?>
<VAST version="4.0" xmlns="http://www.iab.com/VAST">
<Ad id="impression-uuid-here">
<InLine>
<AdSystem version="1.0">Sladu Network</AdSystem>
<AdTitle><![CDATA[Заголовок креатива]]></AdTitle>
<Impression><![CDATA[https://sladu.net/openrtb/imptracker/impression-uuid]]></Impression>
<Creatives>
<Creative id="creative-id" sequence="1">
<Linear skipoffset="00:00:05">
<Duration>00:00:30</Duration>
<MediaFiles>
<MediaFile delivery="progressive" type="video/mp4" width="640" height="360">
<![CDATA[https://cdn.advertiser.com/video.mp4]]>
</MediaFile>
</MediaFiles>
<VideoClicks>
<ClickThrough><![CDATA[https://sladu.net/c/impression-uuid/tracking-token]]></ClickThrough>
</VideoClicks>
</Linear>
</Creative>
</Creatives>
</InLine>
</Ad>
</VAST>
4. Поля VAST
<AdTitle>- заголовок креатива<Impression>- URL pixel для подсчёта показов. Плеер дёргает когда реально показал рекламу.<MediaFile>- URL mp4-видео, размеры (всегда 16:9), MIME-тип<Duration>- длительность ролика в формате HH:MM:SSskipoffset="00:00:05"- через 5 сек можно показать кнопку Skip<ClickThrough>- URL куда вести юзера по клику. Уже содержит наш редирект на рекламодателя + click-tracking.
5. Пустой VAST (no_match)
Если нет подходящего креатива (нет активных кампаний на твоё гео, фильтр антифрода) - возвращаем валидный пустой VAST:
<?xml version="1.0" encoding="UTF-8"?> <VAST version="4.0"></VAST>
Плеер должен обработать это как «рекламы нет» и сразу запустить основной контент. Все нормальные плееры так делают.
6. JW Player 8+
jwplayer("player").setup({
file: "your-content.mp4",
advertising: {
client: "vast",
tag: "https://sladu.net/vast/abc12345.xml"
}
});
Для midroll / postroll:
advertising: {
client: "vast",
schedule: {
preroll: { offset: "pre", tag: "https://sladu.net/vast/abc12345.xml" },
mid: { offset: "50%", tag: "https://sladu.net/vast/abc12345.xml" },
postroll:{ offset: "post", tag: "https://sladu.net/vast/abc12345.xml" }
}
}
7. video.js + videojs-ima
<link href="//vjs.zencdn.net/8.6.1/video-js.css" rel="stylesheet">
<script src="//vjs.zencdn.net/8.6.1/video.min.js"></script>
<script src="//imasdk.googleapis.com/js/sdkloader/ima3.js"></script>
<script src="//unpkg.com/videojs-ima@2.3.0/dist/videojs.ima.js"></script>
<video id="my-player" class="video-js" controls preload="auto" data-setup='{}'>
<source src="your-content.mp4" type="video/mp4">
</video>
<script>
const player = videojs("my-player");
player.ima({
adTagUrl: "https://sladu.net/vast/abc12345.xml"
});
</script>
8. Google IMA SDK (универсальный)
<script src="https://imasdk.googleapis.com/js/sdkloader/ima3.js"></script>
<script>
const adDisplayContainer = new google.ima.AdDisplayContainer(
document.getElementById('ad-container'),
document.getElementById('content-video')
);
adDisplayContainer.initialize();
const adsLoader = new google.ima.AdsLoader(adDisplayContainer);
const adsRequest = new google.ima.AdsRequest();
adsRequest.adTagUrl = "https://sladu.net/vast/abc12345.xml";
adsRequest.linearAdSlotWidth = 640;
adsRequest.linearAdSlotHeight = 360;
adsLoader.requestAds(adsRequest);
adsLoader.addEventListener(google.ima.AdsManagerLoadedEvent.Type.ADS_MANAGER_LOADED, function(e){
const adsManager = e.getAdsManager(document.getElementById('content-video'));
adsManager.init(640, 360, google.ima.ViewMode.NORMAL);
adsManager.start();
});
</script>
9. HLS.js + Google IMA
HLS.js не имеет встроенной VAST-поддержки. Используй комбинацию HLS.js (для контента) + IMA SDK (для рекламы):
if (Hls.isSupported()) {
const hls = new Hls();
hls.loadSource('your-stream.m3u8');
hls.attachMedia(videoElement);
}
// VAST через IMA SDK как в примере выше
const adsRequest = new google.ima.AdsRequest();
adsRequest.adTagUrl = "https://sladu.net/vast/abc12345.xml";
adsLoader.requestAds(adsRequest);
10. Plyr / Flowplayer / Bitmovin / Brightcove
- Plyr - нет встроенного VAST, нужен plyr-ads плагин с поддержкой Google IMA
- Flowplayer - VAST поддерживается из коробки в Commercial-версии, плагин
flowplayer-ima - Bitmovin Player - встроенный AdsModule, конфиг:
{ ads: [{ tag: { url: "https://sladu.net/vast/...", type: "vast" }, position: "pre" }] } - Brightcove - через плагин
bc-vast-ads-plugin - Shaka Player -
shaka-player-imaдобавляет Google IMA
11. Тестирование
Просто открой VAST URL в браузере
Должен показать XML. Если пусто (<VAST version="4.0"></VAST>) - значит нет подходящего креатива для твоего гео.
Google IMA Sample Player
googleads.github.io/googleads-ima-html5/vsi - вставь VAST URL, нажми Play - увидишь как IMA SDK обрабатывает наш VAST.
IAB VAST Inspector
vasttester.iabtechlab.com - официальный инспектор IAB. Проверяет соответствие XML спецификации.
curl
curl -v "https://sladu.net/vast/abc12345.xml" \
-H "Referer: https://yoursite.com/page" \
-H "User-Agent: Mozilla/5.0 (X11; Linux) Chrome/120"
12. Трекинг событий
Сейчас в VAST-ответе мы шлём минимальный набор трекеров:
<Impression>- показ засчитан<ClickThrough>- URL с нашим click-tracking
По запросу можем добавить <TrackingEvents> для:
start- видео начало игратьfirstQuartile,midpoint,thirdQuartile- 25/50/75% просмотреноcomplete- видео досмотрели до концаskip- юзер нажал skipmute,unmute,pause,resume,fullscreen
Сейчас по дефолту они не нужны для биллинга - засчитываем сам показ. Если рекламодатель платит CPV (cost per view, 100% досмотра) - включаем по тикету в саппорт.
Не работает интеграция? Открой VAST URL в браузере - должен показать XML. Если пусто - нет креативов для гео. Если ошибка - пиши в @sladu_support с примером URL и плеером.