Назад к возможностям
Веб-панельЗеркало экрана5 мин чтения

Зеркалирование экрана в веб-панели

Просматривайте и управляйте экраном вашего Android-телефона в браузере — живой холст, полноэкранный режим, режимы качества HD/Smooth, полное удалённое управление (касания, смахивания, прокрутка, клавиши навигации), запись и скриншоты в один клик.

Представление Зеркало экрана в веб-панели отображает экран вашего Android-телефона на вкладке браузера — и это единственное место, где эта функция имеет реальный пользовательский интерфейс. На стороне телефона нет выделенного экрана «Зеркало экрана»; фоновый сервис начинает трансляцию, как только вы начинаете сеанс из браузера, и все элементы управления находятся здесь.

Поскольку поток декодируется с помощью WebCodecs и отображается на элементе <canvas>, страница должна обслуживаться в безопасном контексте (HTTPS или localhost). Локальный сервер PlainApp уже удовлетворяет этому требованию — но если вы по какой-то причине загрузили панель через обычный HTTP по адресу, отличному от localhost, страница показывает запрос необходим HTTPS со ссылкой на безопасный URL вместо попытки запустить поток.

Скриншот: Зеркало экрана

Ключевые возможности

  • Живое зеркало на холсте — кадры декодируются с помощью WebCodecs и отображаются на элементе <canvas>. Никаких плагинов, никакого нативного клиента — только браузер.
  • Полное удалённое управление — после включения управления клики, перетаскивание и прокрутка на холсте преобразуются в реальные касания, долгие нажатия, смахивания и прокрутки на телефоне, нормализованные по фактическим координатам экрана. Выделенные кнопки отправляют «Назад», «Домой» и «Недавние».
  • Полноэкранный режим — разверните холст на весь экран; нажмите Esc (или переключатель на панели инструментов), чтобы выйти.
  • Режимы качества HD / Smooth — переключайте качество во время сеанса: HD приоритет отдаёт чёткости, Smooth жертвует разрешением для снижения задержки на перегруженном Wi-Fi.
  • Захват скриншотов — один клик скачивает .png текущего кадра.
  • Запись сеанса — записывайте холст локально в видеофайл с работающим таймером записи на панели инструментов.
  • Зеркалирование аудио — запросите передачу аудио с телефона и отключайте/включайте звук независимо в браузере.
  • Перезапуск и пауза — приостановите поток, чтобы перестать расходовать пропускную способность без завершения сеанса, или перезапустите сервис зеркалирования на телефоне, если он завис.

Пошаговое руководство

  1. Откройте страницу «Зеркало экрана» с боковой панели панели. Если телефон в данный момент не зеркалирует, нажмите Старт, чтобы запросить начало трансляции с телефона.
  2. Просматривайте живое зеркало — как только телефон предоставит разрешение на захват экрана, кадры появятся на холсте в течение секунды-двух.
  3. Включите удалённое управление с панели инструментов, затем нажимайте, перетаскивайте или прокручивайте на холсте, чтобы взаимодействовать с телефоном, как если бы вы держали его в руках — плюс выделенные кнопки «Назад/Домой/Недавние».
  4. Переключитесь в полноэкранный режим, нажав кнопку полноэкранного режима; нажмите Esc, чтобы вернуться к макету панели.
  5. Измените качество с помощью переключателя HD/Smooth на панели инструментов — переключение вступит в силу на следующем ключевом кадре.
  6. Сделайте скриншот или начните запись с панели инструментов и нажмите Стоп, когда закончите, чтобы завершить сеанс.

Советы и хитрости

  • Отключите звук с панели инструментов, если вы зеркалируете в общем пространстве — это влияет только на ваш браузер, а не на динамик телефона.
  • Приостановите без отключения, нажав кнопку воспроизведения/паузы — полезно, когда нужно прочитать статический экран без расходования пропускной способности на обновления.
  • Перезапустите приложение с панели инструментов, если сервис зеркалирования на телефоне завис — это перезапустит его без перезагрузки телефона.
  • Координаты удалённого управления нормализуются по фактическому разрешению видео, поэтому управление остаётся корректным, даже если вы изменили размер окна браузера или перешли в полноэкранный режим.

Заметки о конфиденциальности и безопасности

  • Веб-панель работает по HTTPS с самоподписанным сертификатом, а весь трафик дополнительно шифруется XChaCha20-Poly1305 поверх TLS.
  • Веб-панель привязана только к вашей локальной сети — она недоступна из интернета, если вы явно не настроите перенаправление портов.
  • API WebCodecs требует безопасного контекста — страница показывает запрос необходим HTTPS, если он отсутствует.
  • Ввод удалённого управления принимается только тогда, когда вы явно включили его для сеанса — закрытие или остановка зеркала немедленно отзывает его.

Связанные возможности