Подключение смартфона Android для отладки web-приложений в Chrome на Win10
Table of contents
Introduction
Отладку web-приложений можно выполнять как в эмуляторе с помощью Chrome DevTools
, так и с использованием реального устройства.
Использование отладки на реальном устройстве позволяет точно идентифицировать проблему. Рассмотрим шаги по настройке подключения устройства к Chrome DevTools
.
Активация режима отладки
Первым делом необходимо включить поддержку отладки на самом устройстве.
Для версии Android 4.2
нужно зайти в настройки устройства, далее открыть информацию о телефоне и перейти к просмотру сведений о ПО.
Находим пункт с номером сборки и начинаем кликать по нему: необходимо кликнуть 7 раз, после чего мы перейдем в режим разработчика (после нескольких кликов можно будет увидеть обратный отсчет с оставшимся количеством кликов до активации режима разработки).
После активации режима разработчика необходимо зайти на первый уровень меню настроек и перейти в новый пункт: "Параметры разработчика" (обычно в самом конце списка).
В списке открывшихся опций активируем отладку по USB
.
Больше информации по режиму разработчика можно найти в разделе справки: https://developer.android.com/studio/debug/dev-options.
Если после активации отладки по USB
устройство не отображается в chrome://inspect/#devices, необходимо перейти к выполнению дальнейших шагов по настройке.
Android USB Driver for Windows
Установим драйвер с официального сайта: https://developer.samsung.com/mobile/android-usb-driver.html.
Установка Android SDK
После установки драйверов мы перейдем к установке Android SDK
.
Сделать это можно, установив Android Studio
через JetBrains Toolbox App
или же с официального сайта: https://developer.android.com/studio.
Запустим Android Studio
и установим Android SDK
.
Вместе с SDK
установится и ADB
(Android Debug Bridge
- Отладочный мост Android
), который позволяет управлять устройством на базе Android
.
Перейдя в настройки File | Settings | Appearance & Behavior | System Settings | Android SDK
, можно посмотреть путь, по которому был установлен SDK
.
Обычно это %AppData%\..\Local\Android\Sdk\
.
Перейдем в директорию platform-tools
с необходимой нам программой: adb
.
Откроем консоль и запустим сервер:
./adb start-server
После этого обновим chrome://inspect/#devices, затем Chrome
должен будет показать подключенные устройства.
Если этого не произошло, то необходимо переподключить устройство к USB
и разрешить отладку во всплывающем окне.
Отладка web-приложения
После того, как на странице chrome://inspect/#devices появились подключенные устройства,
необходимо запустить Chrome
на устройстве и открыть страницу для отладки, после чего обновить chrome://inspect/#devices.
Нажав на inspect
, откроется Chrome DevTools
с продублированным экраном с устройства.
Таким образом, теперь мы можем точно отлаживать свое web-приложение на подключенном устройстве.
При блокировке подключенного устройства экран отладки будет исчезать, чтобы этого избежать, можно в настройках для разработчика (на устройстве) активировать опцию "Не выключать экран".
Дата редактирования : 2020-11-12 00:40:12
Автор : Rosko