Создание собственного приложения для LG Smart TV начинается с установки официального SDK webOS и активации режима разработчика на самом телевизоре. Без этих двух компонентов невозможно ни сборка, ни отладка, ни установка пакета .ipk на устройство. Процесс отличается от разработки под Android TV или Tizen отсутствием необходимости в Android Studio — здесь основным инструментом является командная строка ares-cli.

Вторичный сценарий под фразой «сделать программу» — настройка списка каналов или таймера записи, но в контексте разработки речь идет именно о написании кода. Платформа webOS использует стандартные веб-технологии: HTML5, CSS3 и JavaScript (ES6+), что позволяет веб-разработчикам войти в экосистему без изучения новых языков. Поддерживаются фреймворки React, Vue, Preact и Vanilla JS.

Подготовка окружения и установка SDK

Базовым требованием является наличие Node.js версии не ниже 14.x (рекомендуется LTS-ветка). Установка CLI выполняется одной командой через npm: npm install -g @webosbrew/ares-cli. Пакет включает инструменты для генерации шаблонов, упаковки, установки, запуска и инспекции приложений прямо с компьютера разработчика.

После установки проверьте доступность команд вызовом ares-setup-device --list. Если терминал вернул ошибку о неизвестной команде, добавьте папку глобальных пакетов npm в переменную окружения PATH. Для работы с эмулятором потребуется VirtualBox и образ webOS Emulator, скачиваемый из LG Developer Portal.

  • 🟢 Установите Node.js LTS с официального сайта
  • 🟢 Выполните npm install -g @webosbrew/ares-cli в терминале
  • 🟢 Проверьте версией: ares-cli --version
  • 🟢 При необходимости установите VirtualBox для эмулятора

☑️ Чек-лист готовности окружения

Выполнено: 0 / 4

Активация режима разработчика на телевизоре

Физическое устройство должно быть в одной сети с компьютером (Wi-Fi или Ethernet). Зайдите в Настройки → Общие → О телевизоре → Режим разработчика (на webOS 6.0+ путь может находиться в Настройки → Поддержка → Режим разработчика). Переключите тумблер в положение «Вкл.», после чего телевизор покажет IP-адрес и предложит задать пароль для SSH/SCP соединения.

Запомните или запишите IP-адрес и заданный пароль — они понадобятся для регистрации устройства в CLI. На старых версиях webOS (3.x — 4.x) пункт меню может называться «Настройка для разработчика» и находиться в разделе «Безопасность». Если пункта нет — модель не поддерживает установку сторонних приложений.

⚠️ Внимание: Режим разработчика автоматически отключается при перезагрузке телевизора на прошивках старше 2022 года. Перед каждой сессией отладки проверяйте статус тумблера.

Регистрация устройства в CLI выполняется командой ares-setup-device --add <имя> --ip --port 9991 --user prisoner --password <ваш_пароль>. После успешного добавления устройство появится в списке ares-setup-device --list как default или заданное имя.

💡

Используйте статический IP-адрес для телевизора в настройках роутера (DHCP Reservation), чтобы не перерегистрировать устройство после каждой перезагрузки сети.

Создание структуры проекта и манифеста

Генерация заготовки выполняется командой ares-generate -t basic <имя_папки>. Шаблон basic создает минимальную структуру: appinfo.json (манифест), index.html, js/main.js, css/main.css и иконку icon.png. Манифест — критически важный файл: он определяет id, version, type (web/qml/native), разрешения (requiredPermissions) и точку входа.

Поле id должно быть уникальным в формате обратного домена (например, com.mycompany.myapp). Не совпадайте с системными ID LG. В requiredPermissions перечисляйте доступ к медиа, сети, хранилищу, звуку — без этого системные API вернут ошибку SecurityError. Для видео-плееров обязательно добавьте media.audiovideo и media.playback.

{

"id": "com.example.myapp",


"version": "1.0.0",


"vendor": "MyCompany",


"type": "web",


"main": "index.html",


"title": "My App",


"icon": "icon.png",


"requiredPermissions": ["media.audiovideo", "media.playback"]


}

Сборка, установка и запуск на телевизоре

Упаковка в установочный пакет выполняется командой ares-package <путь_к_папке_проекта>. Результат — файл com.example.myapp_1.0.0_all.ipk в текущей директории. Установка на зарегистрированное устройство: ares-install --device <имя_устройства> <путь_к_.ipk>. Запуск: ares-launch --device <имя_устройства> com.example.myapp.

Если установка прошла успешно, но приложение не запускается (черный экран или возврат в Launcher), откройте инспектор: ares-inspect --device <имя_устройства> com.example.myapp. Откроется DevTools в браузере, где в консоли будут видны JS-ошибки, а во вкладке Network — сетевые запросы. Частая причина — нарушение CSP (Content Security Policy) в index.html: запрещены инлайн-скрипты и eval().

  • 🟢 Соберите пакет: ares-package ./myapp
  • 🟢 Установите: ares-install --device tv ./com.example.myapp_1.0.0_all.ipk
  • 🟢 Запустите: ares-launch --device tv com.example.myapp
  • 🟢 Отладка: ares-inspect --device tv com.example.myapp
💡

Главный цикл разработки: правка кода → ares-package → ares-install → ares-launch → ares-inspect. Автоматизируйте его через npm-скрипты в package.json.

Работа с API webOS: LS2 и системные сервисы

Уникальность платформы — шина служб LS2 (Luna Service Bus). Приложение общается с системой через webOS.service.request, вызывая методы сервисов: com.webos.service.tv.channel (переключение каналов), com.webos.service.drm (DRM-лицензии), com.webos.app.service (управление жизненным циклом). Документация по сервисам доступна на developer.lge.com в разделе «API Reference».

Для кроссплатформенных приложений используйте абстракцию: оберните вызовы LS2 в промисы и проверяйте наличие window.webOS перед вызовом. Это позволит запускать тот же код в браузере (для разработки UI) и на телевизоре. Библиотека @webosbrew/webos-sdk уже содержит типизации TypeScript для основных сервисов.

⚠️ Внимание: Не все сервисы доступны в режиме разработчика. Некоторые (например, управление HDMI-CEC или системные настройки) требуют подписанного приложения с привилегированным уровнем доверия, который выдается только после прохождения QA в LG Content Store.
Пример вызова LS2 для получения списка каналов

const getChannels = () => new Promise((resolve, reject) => { if (!window.webOS) return reject('Not on webOS'); webOS.service.request('com.webos.service.tv.channel', { method: 'getChannelList', parameters: { sourceType: 'TV' }, onSuccess: (res) => resolve(res.channelList), onFailure: (err) => reject(err) });});

Альтернатива: редактор каналов и таймер записи

Если под «сделать программу» вы имели в виду пользовательскую настройку, а не написание кода, LG предоставляет встроенные инструменты. В меню Каналы → Редактор каналов можно сортировать, удалять, блокировать и переименовывать каналы. Для создания списка «Избранное» нажмите цветную кнопку на пульте (обычно желтую или зеленую) в режиме просмотра — канал добавится в отдельную группу.

Таймер записи (PVТ) настраивается в Расписание записей (доступно при подключенном USB-накопителе с файловой системой NTFS или exFAT). Выберите канал, дату, время начала и окончания. Телевизор должен быть в режиме ожидания (не полностью отключен от сети) для срабатывания таймера. На моделях без встроенного тюнера (например, серии OLED без приставки) запись недоступна.

ФункцияПуть в меню (webOS 6.0+)Требования
Редактор каналовНастройки → Каналы → Редактор каналовАктивный источник ТВ
ИзбранноеКолор-пульт → Желтая/Зеленая кнопкаСтандартный пульт Magic Remote
Таймер записиНастройки → Каналы → Расписание записейUSB HDD (NTFS/exFAT), Тюнер
LG Channels (бесплатный контент)Главный экран → Приложение LG ChannelsИнтернет, регион поддержки

Публикация в LG Content Store

Для распространения приложения широкой аудитории необходимо зарегистрироваться в LG Seller Lounge (seller.lge.com). После верификации аккаунта (требуются данные компании или ИП) создайте новый продукт типа «TV App». Загрузите подписанный .ipk (подпись выполняется через ares-sign с сертификатом от LG), заполните метаданные: описание, скриншоты (1280x720), иконку 512x512, возрастной рейтинг, поддерживаемые модели и версии webOS.

Модерация занимает от нескольких дней до двух недель. Основные причины отказа: нарушение CSP, использование недокументированных API, отсутствие обработки ошибок сети, несоответствие UI гайдлайнам LG (навигация пультом, фокус, анимации). После одобрения приложение появляется в магазине автоматически или в указанную дату.

📊 Какой этап разработки под webOS кажется вам самым сложным?
Настройка SDK и CLI
Активация режима разработчика на ТВ
Работа с LS2 API и сервисами
Прохождение модерации в Seller Lounge

Частые проблемы и их диагностика

Приложение устанавливается, но иконка не появляется в Launcher — проверьте appinfo.json на валидность JSON и наличие поля icon с существующим файлом. Ошибка INSTALL_FAILED часто означает несовпадение архитектуры (arm64 vs x86) или попытку установить приложение с ID, уже занятым системным пакетом. Удалите старую версией через ares-install --device tv --remove com.example.myapp перед повторной установкой.

Проблемы с CORS при запросах к API решаются настройкой заголовков на вашем бэкенде (Access-Control-Allow-Origin: *) или использованием прокси-сервиса. В webOS нет флага --disable-web-security как в Chrome, поэтому обход Same-Origin Policy возможен только через нативный сервис com.webos.service.network или корректную настройку сервера.

⚠️ Внимание: Не храните секретные ключи API в коде приложения. Файл .ipk — это обычный ZIP-архив, его содержимое можно извлечь и прочитать. Используйте backend-for-frontend или токены с ограниченными правами.
💡

Для быстрой итерации UI разрабатывайте в браузере (npm run serve), подключая мок-адаптер для webOS API. На реальный телевизор выкладывайте только для тестирования навигации пультом и видео-рендеринга.

FAQ: Частые вопросы о разработке под LG webOS
Можно ли разрабатывать под LG TV без физического телевизора?

Да, существует официальный эмулятор (VirtualBox + образ webOS) и симулятор в браузере (webOS Simulator), но они не полностью воспроизводят производительность, DRM, работу с тюнером и пультом. Для финального тестирования нужен реальный девайс.

Поддерживает ли webOS TypeScript и современные бандлеры (Vite, Webpack)?

Да. Официальный шаблон ares-generate -t typescript или ручная настройка Vite/Webpack с выводом в папку dist, которая затем упаковывается ares-package. Главное — настроить base: './' в конфиге бандлера для относительных путей.

Как обновить уже установленное приложение без переустановки?

Полной горячей перезагрузки нет. Необходимо увеличить version в appinfo.json, собрать новый .ipk и выполнить ares-install — он обновит пакет с сохранением данных (LocalStorage, IndexedDB), если ID совпадает.

Работает ли WebAssembly (Wasm) на webOS?

На webOS 5.0+ (Chrome 79+) — да, с ограничениями по памяти. На старых версиях (webOS 3.x/4.x) — нет. Для тяжелых вычислений (кодеки, шифрование) Wasm дает прирост, но увеличивает размер бандла.

Где найти примеры кода и образцы приложений?

Официальный репозиторий LG: github.com/webosbrew/webos-app-samples. Там есть примеры плееров, игр, работы с пультом, LS2-сервисами и DRM. Также полезен discord-сообщество webOS Homebrew.