PS:点赞，评论，收藏，分享 防止迷路
要在 Chrome 中通过 chrome://inspect/#devices 查看并调试手机上的网页，可以按照以下步骤操作：
-
确保设备连接：
- 使用 USB 线将手机连接到电脑。
- 在手机上启用开发者选项和 USB 调试模式。通常可以在手机的“设置” -> “关于手机”中连续点击版本号几次以开启开发者选项，然后在“开发者选项”中找到并启用“USB 调试”。
-
打开 Chrome 并进入 Inspect 页面：
- 在电脑上打开 Chrome 浏览器。
- 输入
chrome://inspect/#devices并回车。
-
查看已连接设备：
- 如果手机成功连接并且 USB 调试已启用，你应该能在
Remote target discovery部分看到你的设备。 - 该部分会列出所有正在运行的 Web 页面或应用，包括 Chrome 浏览器中的标签页和其他支持 WebView 的应用。
- 如果手机成功连接并且 USB 调试已启用，你应该能在
-
选择要调试的页面：
- 找到你想要调试的页面（例如，手机浏览器中的某个标签页）。
- 点击页面旁边的
inspect按钮，这将打开一个新的 DevTools 窗口，允许你查看和调试该页面的代码、网络请求等信息。
-
使用 Wi-Fi 进行调试（可选）：
- 如果不想通过 USB 连接，也可以通过 Wi-Fi 进行调试。需要确保手机和电脑在同一网络下，并且在手机上启用“无线调试”选项（部分设备可能需要 Android 11 或更高版本）。
- 在
chrome://inspect/#devices页面中点击“配置”，添加手机的 IP 地址和端口号进行连接。
-
注意事项：
- 确保手机和电脑的时间同步，避免由于时间差异导致连接失败。
- 如果遇到问题，尝试重启 ADB 服务或者重新插拔 USB 线。
通过以上步骤，你可以方便地查看和调试手机上的网页内容。
在 chrome://inspect/#devices 页面中通过 Wi-Fi 进行设备调试时，添加手机的 IP 地址和端口号进行连接的具体步骤如下：
前提条件
- 确保手机和电脑在同一 Wi-Fi 网络下。
- 手机已启用开发者选项和 USB 调试。
- 手机已启用无线调试（Wireless Debugging）（适用于 Android 11 及以上版本）。
步骤
1. 在手机上启用无线调试
- 打开手机的“设置”。
- 进入“开发者选项”。
- 启用“无线调试”。
- 如果有提示，选择“使用配对码配对设备”，并记下配对码和 IP 地址及端口（例如：
192.168.1.100:5555）。
2. 使用 USB 连接进行初始配对（仅首次需要）
- 将手机通过 USB 线连接到电脑。
- 在电脑上打开命令行工具（Windows 的 CMD 或 PowerShell，macOS/Linux 的终端）。
- 输入以下命令进行配对：
例如：adb pair <IP 地址>:<端口号>adb pair 192.168.1.100:5555 - 手机会弹出一个确认对话框，输入配对码并确认。
3. 断开 USB 并通过 Wi-Fi 连接
- 断开 USB 线。
- 在命令行中输入以下命令连接到设备：
例如：adb connect <IP 地址>:<端口号>adb connect 192.168.1.100:5555
4. 在 Chrome 中配置无线调试
- 打开 Chrome 浏览器，输入
chrome://inspect/#devices并回车。 - 点击页面中的“配置”按钮。
- 在弹出的窗口中点击“添加网络位置”。
- 输入手机的 IP 地址和端口号（例如：
ws://192.168.1.100:5555），然后点击“确定”。
5. 查看和调试设备
- 如果配置成功，你应该能在
Remote target discovery部分看到你的设备。 - 找到你想要调试的页面或应用，点击旁边的
inspect按钮，即可打开 DevTools 进行调试。
注意事项
- 保持 Wi-Fi 稳定：Wi-Fi 连接可能会不如 USB 稳定，确保网络环境良好。
- 防火墙设置：确保电脑和手机的防火墙允许 ADB 和 Chrome 的调试流量。
- 断开 USB 后仍可调试：一旦通过 USB 成功配对，后续可以通过 Wi-Fi 直接连接，无需再次使用 USB。
通过这些步骤，你可以方便地通过 Wi-Fi 在 chrome://inspect/#devices 页面中查看和调试手机上的网页。
PS:创作不易 学会了记得，点赞，评论，收藏，分享
