Перейти к основному содержимому

Интеграция и настройка Web‑виджета

Документация по интеграции сервиса “Oohdesk, web-виджет”

Документация по интеграции

Код приложения

ПлатформаСсылка
LinuxСкачать zip‑архив (обновлено 09.09.2025, актуально на 09.04.2026):
https://drive.google.com/file/d/1Nre-Z8RnjJnO8QtUUmpQFaKPZ2cPBdls/view?usp=sharing
WindowsСкачать msi‑файл (обновлено 09.04.2026, актуально на 09.04.2026):
https://drive.google.com/file/d/1oFdg5dHQM35hPVOxHS2ygrUbG5tuiEtT/view?usp=sharing
(версия без скрипта для ввода пин-кода, если он нужен - скачать отдельно)

Запуск

1 шаг: Откройте папку с архивом приложения.
При первом запуске укажите ссылку на вашу CMS. Эта ссылка запишется в конфиг приложения. Повторно приложение можно запускать уже без этого параметра.
Приложение во всех ОС имеет автозапуск при включении системы.

--entrypoint – один из вариантов указания конфигов, другие описаны в главе Конфиги.

ОСИнструкция
LinuxЗайдите в консоль в корне скачанной папки (там уже готовое приложение).
Запустить приложение в первый раз:
./backend --entrypoint="https://indoor.simb-ad.com"
Запустить приложение повторно:
./backend
WindowsЗапустите полученный msi‑файл.
Он распакуется по пути:
Этот компьютер > Локальный диск (С:) > Пользователи > [Пользователь] > AppData > Local > Oohdesk web widget
Перейдите по пути:
app-[версия] > resources > app > backend
Далее запускать всегда из этого пути.
Открыть консоль в этой папке.
Запустите приложение в первый раз:
./backend.exe --entrypoint="https://indoor.simb-ad.com"
Запустите приложение повторно:
./backend.exe

2 шаг: Открыть приложение в браузере.
Адрес по умолчанию: http://localhost:1080 (изменить можно в конфигах, подробности в главе Конфиги).

А лучше открыть не localhost:1080, а файл oohdesk-web-widget_EXAMPLE.html, где сэмулирована среда вашего приложения – сайт, внутри которого находится iframe‑плеер.

Скачать файл oohdesk-web-widget_EXAMPLE.html:
https://drive.google.com/file/d/1fIFAFkrSuYRVkFrBygllscj-HBy2yhVg/view?usp=sharing

Запуск приложения, консоль

Запуск приложения, консоль

Файл html с эмуляцией двух экземпляров iframe

Файл html с эмуляцией двух экземпляров iframe


Активация плеера через sh скрипт

Это активация через скрипт, то есть через консоль. Активация через интерфейс (+ про пин-код) описана ниже в главе Активация плеера через интерфейс.

1 шаг. Взять файл в корне скачанного архива приложения ИЛИ скачать файл:

ОССсылка
Linuxhttps://drive.google.com/file/d/1qf2YueVeSQihBCLNw9B7sSOk0fn7L79o/view?usp=sharing
WindowsЕсли у вас PowerShell или CMD:
https://drive.google.com/file/d/12eOU6BhprBhQ3SdOMwWy0XNpeJsTQnkU/view?usp=sharing

Если у вас Git Bash:
Скачайте sh‑файл для Linux

2 шаг. Запустить (скрипт может лежать в любом месте):

  • PIN-КОД – пин‑код без пробелов
  • ENTRYPOINT – ссылка на используемый сайт CMS
ОСКоманда
Linux
(или Git Bash на Windows)
./activate-pin-v1.sh <PIN-КОД> [ENTRYPOINT]

Например:
./activate-pin-v1.sh 8142330100 https://indoor.simb-ad.com
Windows./activate-pin-v1.bat <PIN-КОД> [ENTRYPOINT]

Например:
./activate-pin-v1.bat 8142330100 https://indoor.simb-ad.com
Успешная активация

Успешная активация

Запускать приложение перед этим не обязательно, можно сначала активировать, а потом запустить.
Ничего страшного, если до этого уже запускали приложение – можно запустить скрипт в любое время и сколько угодно раз. Главное потом перезапустить ./backend (или ./backend.exe), чтобы настройки применились.


Закрыть приложение

В консоли, где запущено приложение – нажмите Ctrl+C. Также можно спокойно закрывать браузер.


Конфиги

Есть возможность изменить конфиги приложения под себя. По умолчанию конфигурация хранится внутри приложения, но можно создать свою собственную конфигурацию. Для этого надо создать файл по пути:

~/.config/oohdesk-web-widget/config.json

И заполнить его минимальным шаблоном (это обязательные параметры).
(Поля, подсвеченные зелёным цветом, можно менять. Остальное лучше не трогать – оно заполнится самим приложением)

{
"config": {
"entrypoint": "https://indoor.simb-ad.com",
"appData": "~/.config/oohdesk-web-widget",
"frontDir": "dist"
},
"AppPort": "1080"
}

При каждом изменении конфига нужно перезапускать приложение (./backend или ./backend.exe), чтобы конфиги применились.

Все настройки, которые можно прописать в файле config.json:

{
"rebootId": 0,
"config": {
"entrypoint": "https://indoor.simb-ad.com",
"appData": "/home/spanri/.config/oohdesk-web-widget",
"frontDir": "dist"
},
"v": null,
"activate": {},
"frontData": {
"splashImageNotActivatedSrc": "...",
"splashImageNoContentSrc": "..."
},
"VerboseConsole": true,
"AppPort": "1080"
}
  • config.entrypoint – Ссылка на используемый сайт CMS.

  • frontData.splashImageNotActivatedSrc – Картинка, когда плеер не активирован. По умолчанию показывается серый логотип Oohdesk. Можно заменить на что-то своё.

    Внимание: это браузер, здесь нельзя грузить ссылки вида file:///home/user/…. Принимаются все форматы, подходящие для тега <img>.

  • frontData.splashImageNoContentSrc – Картинка, когда плеер активирован, но нет контента и филлеров (например, нет в CMS кампании, контент ещё не подгрузился, что-то сломалось). По умолчанию показывается цветной логотип Oohdesk.

  • VerboseConsole – Если true, то в консоли показываются подробные логи работы.

  • AppPort – Порт, по которому работает приложение – и бэкенд, и фронтенд. Например, если порт 1080 уже занят, можно написать любой другой удобный порт.


Настройки

Как открыть: Это в приложении плеера в браузере. 4 раза кликните ЛКМ на плеер в любом месте.

Здесь расположена активация и некоторые параметры (для удобного просмотра и управления). Можно пользоваться этим, а можно управлять через postMessage.

Настройки в интерфейсе плеера 1Настройки в интерфейсе плеера 2

Настройки в интерфейсе плеера


Общение iframe ↔ родительский сайт

Изучить взаимодействие можно на примере файла oohdesk-web-widget_EXAMPLE.html – там реализованы все варианты взаимодействия.

Общение осуществляется с помощью postMessage. Например:

widget.postMessage({ type: "activate", payload: {} }, "*");

Доступные type сообщений (ваш сайт посылает в плеер с помощью widget.postMessage):

ТипpayloadОписание
activatepin_code – PIN‑код из CMS для активации устройстваАктивировать устройство, минуя интерфейс. Плюс в postMessage передаётся третий параметр messageId, по которому можно поймать результат выполнения активации (см. activate:success и activate:error).
deactivateДеактивировать устройство (отвязать от сайта CMS).
settings:openОткрыть экран настроек (вместо 4‑кратного клика).
settings:closeЗакрыть экран настроек.
media:startПосле старта браузера контент не показывается. Нужно послать этот сигнал для начала показа. Показывает один атом рекламы. Если в CMS создана кампания с режимом “Блок” (и указано 10 сек, например), то 1 атом = 10 сек. Если контент уже играет – ничего не произойдёт, продолжит доигрываться текущий контент.
media:interruptСигнал для резкой остановки воспроизведения (например, когда нужно переключить вид плеера с fullscreen на маленький виджет). В этом случае контент будет считаться не проигранным и начнёт проигрываться снова при следующем сигнале media:start. Если ничего не играет и отправить этот сигнал – ничего не произойдёт.

Доступные типы принимаемых сообщений (плеер отправляет в ваш сайт, а ваш сайт ловит через window.addEventListener):

ТипpayloadОписание
activate:success(response) => voidОтвет для activate, когда успешно.
activate:error(errorMessage: Error) => voidОтвет для activate, когда не получилось активировать, ошибка.
widget:statusis_player_activated – boolean, активирован ли плеер PIN‑кодом;is_media_playing – boolean, играет ли сейчас какой‑то контент из CMS (даже если это филлер)Общий статус виджета. Когда что‑то меняется, плеер отправляет этот сигнал.
media:endmedia – объект с медиа‑контентом, который закончил игратьПлеер закончил воспроизведение атома рекламы и отправляет этот сигнал.

Активация плеера через интерфейс

В CMS создаётся плеер. После создания плеер получает пин‑код.
Этот пин‑код вводится на экране активации (в настройках). Если активация успешна, is_player_activated станет true, а на экране будет отображаться заставка.

Пин‑код одноразовый! После активации его нельзя использовать второй раз.

При деактивации устройства на плеере оно не деактивируется в CMS – просто будет гореть в CMS красным. Для генерации нового пин‑кода в CMS надо деактивировать устройство (три точки → Деактивировать). После этого появится новый пин‑код для генерации.

Пример неактивированного плеера в CMS

Пример, как выглядит неактивированный плеер в CMS


Скриншоты

В CMS есть управление устройством. Одна из функций – запросить скриншот (если на устройстве ловит интернет).

В версии от 14.07.2025 скриншоты пока нельзя делать из CMS (но можно поиграться с их настройкой).

В браузере нельзя дать доступ к экрану один раз навсегда – нужно давать каждый раз при обновлении страницы (как в Google Meet). Поэтому в настройках есть данные о том, настроены ли сейчас скриншоты. Если не настроены – нажмите кнопку “Настроить”, и браузер спросит, какое окно расшаривать (например, вкладку браузера или весь экран дисплея).


Управление контентом

Контент – любые файлы из CMS (в том числе из SSP, если настроен VAST). Из CMS – изображения, видео, HTML. Из VAST – любой контент, разрешённый технологией VAST (сейчас поддерживаем только MP4).

Когда контент (если он есть) скачается из CMS, он начнёт показываться на экране. В этот момент is_media_playing будет true.

Контент (реклама, филлеры) скачивается автоматически, когда появляется доступ к интернету. Всё управление осуществляется через CMS.