使用Chrome的WebADB工具来调试手机

最近在找移动端的调试方法，无意中发现chrome新出了WebADB的功能，虽然还在测试阶段但也比较好奇遂尝试一番

关于ADB可能移动端开发的同学会比较了解，通常都需要进行繁琐的环境配置如果需要在其他人的设备调试就比较麻烦了，chrome推出的WebADB可以不用安装任何依赖，直接连接手机，下面以我的手机为例记录下相关步骤。

设备：华为Mate 20；

1. 在chrome中打开 webADB控制台

地址： https://app.webadb.com/

看到如下界面（我也不知道为什么有广告）

2. 添加设备至控制台

把手机的USB连接模式设置为传文件（或者叫文件传输，手机厂商差异）如下图，手机需要打开USB调试模式（各个型号手机可能有差异，直接百度手机型号+打开USB调试即可）

随后用数据线将手机连接至电脑，在网页点击add device添加设备，选择你的设备然后点击连接即可添加成功

3. 连接设备

在下拉栏选中你的设备，点击Connect即可连接切换左侧菜单栏即可切换不同功能，例如文件管理器，命令行工具，安装软件，屏幕截图等。

以 Scrcpy（是一款开源免费的屏幕镜像应用，已集成在此处）为例，可以显示手机画面并控制手机，切换到此项，并点击 Start等待依赖安装完毕即可成功连接。

可以进行双向操作（大约会有1秒左右的延迟），尝试一下。

关于ADB的更多进阶操作可以百度一下，这里就不在赘述了

贴一篇比较齐全的

ADB 操作命令详解及用法大全

我的个人公众号：归园田居 每日分享前端知识与资讯～