AdLoader

Модуль для загрузки и воспроизведения рекламы «по месту» (на готовом видеотеге в любой момент времени). API модуля реализует интерфейсы для загрузки, предзагрузки и проигрывания рекламы. Контроль над запуском этих процессов осуществляется из внешнего кода (со стороны кода вставки).

Основные понятия

Загрузка рекламы

Процесс получения информации о том, какие рекламные креативы нужно проиграть — в какой последовательности и с какими параметрами.

Предзагрузка рекламы

Процесс подготовки данных к запуску рекламы для ускорения последующего запуска рекламных креативов.

Проигрывание рекламы

Процесс показа рекламного креатива на стороне пользователя.

Способы загрузки рекламы

Модуль AdLoader позволяет загружать рекламу разными способами:

  • Загрузка с привязкой к рекламной кампании РСЯ (с использованием параметров partnerId, category). В этом случае параметры загрузки и проигрывания рекламы берутся из VMAP.
  • Загрузка с привязкой к рекламной кампании Adfox (с использование параметров adFoxParameters).
  • Загрузка рекламы по ссылке на конкретный VAST (с использование параметров vastUrl).

Создание и проигрывание рекламы

  1. Создайте экземпляр AdLoader. Для этого вызовите метод .create(adConfig) у объекта AdLoader.
  2. После создания экземпляра AdLoader можно загрузить рекламу с помощью метода adLoader.loadAd(); — в результате вернётся promise, отдающий экземпляр AdStore.
  3. После создания экземпляра AdStore можно:
    • Предзагрузить файлы рекламных креативов с помощью метода .preload(preloadParams) для ускорения последующего запуска рекламы.
    • Сразу запустить проигрывание контента с помощью метода .showAd(videoSlot, slot, playbackParameters).
  4. Для гибкого контроля над процессом воспроизведения рекламы используйте метод .createPlaybackController(videoSlot, slot, playbackParameters), возвращающий объект AdPlaybackController. AdPlaybackController позволяет подписываться на события и вызывать методы во время проигрывания.

Пример кода вставки

ya.videoAd
    .loadModule('AdLoader')
    // 1) Создаем экземпляр AdLoader с рекламными параметрами
    .then(function(module) {
        return module.AdLoader.create({
            partnerId: partnerId,
            category: category,
            targetRef: window.location.href,
            videoContentUrl: 'https://download.blender.org/peach/bigbuckbunny_movies/BigBuckBunny_320x180.mp4',
            videoContentDuration: 596,
            // Опциональный параметр идентификатора блока.
            // Если параметр не указан, используется блок типа preroll.
            impId: impId,
        });
    })
    // 2) Загружаем рекламу
    .then(function(adLoader) {
        return adLoader.loadAd();
    })
    // 3) Предзагружаем рекламу
    // Этот пункт пропускается, если рекламу необходимо запустить сразу
    .then(function(adStore) {
        // Запускаем предзагрузку
        return adStore.preload({
            videoSlot: video,
            desiredBitrate: 1000,
        })
        .then(function() {
            return adStore;
        })
        .catch(function() {
            // Игнорируем ошибки в предзагрузке
            return adStore;
        });
    })
    // 4) Запускаем рекламу
    .then(function(adStore) {
        // Создаем контроллер воспроизведения
        const adPlaybackController = adStore.createPlaybackController(video, slot);
        // Подписываемся на событие окончания рекламы
        adPlaybackController.subscribe('AdStopped', function() {
            console.log('Ad stopped playing');
        });
        // Запускаем проигрывание рекламы
        adPlaybackController.playAd();
    })
    // Если что-то пошло не так, логируем ошибку в консоль
    .catch(function(error) {
        console.error(error);
    });

Тестовые данные

Для тестирования можно использовать настройки:

РСЯ

{
  partnerId: 291193,
  category: 0,
}

Adfox

{
  adFoxParameters: {
    ownerId: "270901",
    params: {
      p1: "cwdyt",
      p2: "hiuy"
    }
  }
}

Пример тестовой страницы

Важно

Текущие настройки нельзя использовать в продуктовом окружении.

Следующая