Размещение видео из Boomstream на GetCourse

Коротко о главном:
Для размещения видео из Boomstream на GetCourse используйте HTML-блок в редакторе урока. Создайте или отредактируйте урок, добавьте блок «HTML» из раздела «Вставка» и вставьте iframe-код плеера из личного кабинета Boomstream. Для адаптивного отображения на мобильных устройствах используйте CSS-обёртку с padding-bottom 56.25%. Зрители смогут смотреть защищённое видео прямо в интерфейсе GetCourse.


Зачем использовать Boomstream с GetCourse

У GetCourse есть встроенный видеохостинг, но для платного контента часто требуется усиленная защита. Boomstream дополняет функционал GetCourse:

  • Защита от скачивания через шифрование видеопотока;
  • Динамические водяные знаки с данными ученика;
  • Контроль сессий и отслеживание подозрительной активности;
  • Запрет встраивания на сторонние сайты через защиту по домену;
  • Собственная аналитика просмотров независимо от LMS.

Встраивание через iframe позволяет сохранить все защитные функции Boomstream, используя GetCourse для методической части и управления учениками.


Пошаговая инструкция

Шаг 1. Создайте или отредактируйте урок

В личном кабинете GetCourse перейдите в раздел «Обучение», выберите нужный тренинг и откройте урок для редактирования. При необходимости создайте новый урок.

Создание нового урока в тренинге GetCourse

Шаг 2. Добавьте HTML-блок

Нажмите на кнопку «+» для добавления нового блока. В открывшемся меню нажмите «Показать все блоки», перейдите в раздел «Вставка» и выберите блок «HTML».

Выбор HTML-блока в редакторе урока GetCourse

Шаг 3. Откройте блок для редактирования

Кликните на появившийся пустой HTML-блок, чтобы открыть окно ввода кода.

Пустой HTML-блок в редакторе урока

Шаг 4. Вставьте iframe-код плеера

Вставьте скопированный из Boomstream iframe-код в поле редактирования. Можно использовать как простой iframe с фиксированными размерами, так и адаптивный вариант с CSS-обёрткой для корректного отображения на всех устройствах.

Вставка iframe-кода плеера Boomstream в HTML-блок

Шаг 5. Сохраните изменения

Нажмите кнопку сохранения в редакторе урока. Видео из Boomstream появится на странице урока и будет доступно ученикам согласно настроенному доступу.

Итоговый вид урока с встроенным видео Boomstream


Варианты кода для вставки

Простой iframe с фиксированными размерами

Подходит, если на странице задана конкретная ширина контейнера и не требуется адаптивность:

HTML
<iframe width="640" height="360" src="https://play.boomstream.com/код_медиа" frameborder="0" scrolling="no" allowfullscreen></iframe>

Замените код_медиа на реальный код вашего видео из личного кабинета Boomstream.

Адаптивный iframe с CSS-обёрткой

Рекомендуемый вариант — плеер автоматически подстраивается под ширину экрана, сохраняя пропорции 16:9:

HTML
<style>
.embed-container {
    position: relative;
    height: 0;
    overflow: hidden;
    max-width: 100%;
    padding-bottom: 56.25%;
}
.embed-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
</style>
<div class="embed-container">
    <iframe src="https://play.boomstream.com/код_медиа" frameborder="0" scrolling="no" allowfullscreen></iframe>
</div>

CSS-обёртка обеспечивает корректное отображение на десктопах, планшетах и смартфонах без горизонтальной прокрутки.


Сводная таблица

Шаг Действие
1 Откройте нужный урок в разделе «Обучение» GetCourse
2 Добавьте блок HTML через меню «Вставка»
3 Кликните на пустой блок для редактирования
4 Вставьте iframe-код плеера из Boomstream
5 Сохраните изменения в уроке

Рекомендации по встраиванию

Используйте адаптивный код для большинства сценариев. Ученики заходят на GetCourse с разных устройств, и адаптивный плеер гарантирует комфортный просмотр без масштабирования страницы.

Защищайте домен GetCourse в настройках проекта Boomstream. Добавьте getcourse.ru или ваш припаркованный домен в белый список, чтобы исключить встраивание плеера на сторонние ресурсы.

Настройте сквозную авторизацию для автоматической подстановки пароля ученика. Передавайте email и ID пользователя через параметры URL (?id_recovery={uid}), и зритель получит доступ без ручного ввода пароля.

Включите водяные знаки для платных курсов. При активной защите от скачивания персонализируйте плеер — email ученика будет отображаться поверх видео, что защитит от записи экрана.

Проверяйте отображение на разных устройствах после публикации урока. Откройте урок как ученик и убедитесь, что плеер корректно работает и все функции защиты активны.


Частые вопросы (FAQ)

Нужно ли менять код плеера, если я обновлю видео в Boomstream?
Нет. Ссылка в iframe остаётся прежней — обновляется только контент внутри плеера. Если вы замените видеофайл в личном кабинете Boomstream, изменения автоматически отобразятся у всех учеников GetCourse.

Работает ли защита от скачивания при встраивании на GetCourse?
Да. Все функции защиты (шифрование, водяные знаки, запрет перемотки) сохраняются при встраивании через iframe. Убедитесь, что домен GetCourse добавлен в список разрешённых в настройках защиты проекта.

Что делать, если видео не отображается на мобильных устройствах?
Используйте адаптивный код с CSS-обёрткой вместо простого iframe с фиксированными размерами. Обёртка с padding-bottom 56.25% обеспечивает корректное масштабирование под любой размер экрана.

Можно ли встроить несколько видео в один урок?
Да. Добавляйте несколько HTML-блоков с разными iframe-кодами. Каждое видео будет проигрываться независимо, с собственными настройками защиты и параметрами воспроизведения.

Как настроить автоматическую авторизацию ученика в плеере?
Используйте параметры сквозной авторизации в URL плеера. Добавьте ?id_recovery={uid} с ID ученика GetCourse, и пароль подставится автоматически. Подробная инструкция доступна в статье о сквозной авторизации.

Влияет ли встраивание Boomstream на скорость загрузки страницы урока?
Минимально. Iframe загружается асинхронно и не блокирует рендеринг страницы. Для оптимизации размещайте тяжёлые элементы (видео, изображения) ниже первого экрана и используйте ленивую загрузку.

Что делать, если плеер отображается слишком маленьким или большим?
Отредактируйте параметры width и height в iframe-коде или используйте адаптивную CSS-обёртку. Для тонкой настройки размеров контейнера изменяйте max-width в CSS-классе embed-container.

Можно ли использовать параметры URL для настройки плеера?
Да. Добавьте параметры к ссылке в iframe: autoplay=1 для автостарта, rewind=0 для запрета перемотки, title=0 для скрытия названия. Полный список параметров доступен в документации Boomstream.

Сохраняется ли статистика просмотров при встраивании на GetCourse?
Да. Вся аналитика (просмотры, досматриваемость, география, устройства) собирается в личном кабинете Boomstream независимо от места встраивания плеера. GetCourse видит только факт загрузки страницы урока.

Что произойдёт, если ученик попробует скачать видео через инструменты разработчика?
При активной защите от скачивания видеопоток шифруется, и скачанные сегменты невозможно воспроизвести без ключа дешифрования. Дополнительно динамические водяные знаки с email ученика делают бессмысленной запись экрана.

Работают ли субтитры и таймкоды при встраивании на GetCourse?
Да. Все функции плеера (субтитры, таймкоды, плейлисты, настройки качества) сохраняются при iframe-встраивании. Зритель сможет использовать их так же, как на прямой ссылке Boomstream.