这篇文章给大家聊聊关于谷歌浏览器开启远程调试，以及谷歌浏览器开启远程调试功能对应的知识点，希望对各位有所帮助，不要忘了收藏本站哦。

本文目录

1. 移动端手机调试的几种方法
2. 有没有用手机远程控制另一台手机的软件
3. qq浏览器远程调试微信内置浏览器

一、移动端手机调试的几种方法

很多时候，我们在进行移动端开发时，都是先在PC端使用手机模拟器进行调试，没有问题后，我们才会在手机端的浏览器进行测试，这个时候，如果没有出现问题，皆大欢喜。但是一旦出现问题，我们就很难解决，因为缺乏可视化的界面。不似在PC端，我们能直观的去改变样式，或者是进行断点调试。

1、Chrome DevTools（谷歌浏览器）的模拟手机调试

3、Chrome DevTools远程调试Android

这种调试方式不仅能用于模拟手机调试还是主要的PC端页面调试的方式，这里主要说用于手机调试。

a.谷歌浏览器的开发者工具，可以参照下图右键选择”检查“或者使用快捷键F12，打开开发者工具。

b.打开后看到类似如下界面的开发者调试界面，Elements可以查看文档元素，Console可以在线调试js和查看输出结果，Sources可以调试JS和查看依赖资源，Network查看所有的网络请求等等。

c.如果没有需要模拟的机型怎么办？可以增加，点开机型设置面板，选择edit，然后可以在右方修改展示机型，如下：

a.使用数据线将 iPhone与 Mac相连

b.iPhone开启 Web检查器（设置 -> Safari -> 高级 -> 开启 Web检查器）

c.iPhone使用 Safari浏览器打开要调试的页面（以兰亭单品页为例）

d.Mac打开 Safari浏览器调试（菜单栏 —> 开发 -> iPhone设备名 -> 选择调试页面）

如果你的菜单栏没有“开发”选项，可以到左上角 Safari -> 偏好设置 -> 高级 -> 在菜单栏中显示“开发”菜单。

e.在弹出的 Safari Developer Tools中调试。

经过如上步骤就可在 Mac端调试 iPhone上 Safari运行的页面了。

a.在 Chrome浏览器地址栏中输入  chrome://inspect/#devices 并回车，就可以打开 Inspect调试界面，此时我们勾选Discover USB devices 选项便可以看到设备列表。

b.然后打开手机中开发者选项并打开 USB调试开关（具体方法自行百度，不同手机有一定区别），使用数据线将手机连接到电脑上，我们就可以在设备列表中看到自己的设备。

c.这时，打开手机上的Chrome浏览器，随便打开一个网址（以兰亭单品页为例），设备列表中你的设备下便会出现你打开的页面。

e.接下来你便可以和调试 PC界面一样通过 Chrome进行你所需要的调试，你在左侧屏幕上做的一切操作和你的手机上的操作会始终保持同步，如果你嫌左边这块多余，也可以关闭 Toggle Screencast只保留控制台本身。

二、有没有用手机远程控制另一台手机的软件

两台都是安卓系统的手机要进行远程控制的话，可以借助AirDroid软件，进行远程控制，而且最少有3种方法进行远程控制哦

首先被控制的手机安装AirDroid，然后注册账号登陆。登陆成功后可以设置辅助权限（无障碍）控制【点击个人→安全及远程功能设置呼出菜单，进入远程控制选项。】

或者设置免root权限【USB开启调试功能，打开AirDroid个人版桌面客户端，点击远程控制模块，点击免Root】

这样被控端的手机就可以被远程控制了。

控制有3种途径，可以根据自己的需要随意选择

您想要操作的安卓手机上安装AirMirror客户端，登陆与被控手机一致的airdroid账号，登录后您即可在AirMirror的设备列表里看到您想要控制的安卓手机了。

从AirDroid官网下载AirDroid电脑客户端，登录您的AirDroid帐号，需和手机端登录的帐号保持一致，点击远程控制图标，选择想要控制的设备，发起远程控制请求

3、web网页端控制（适合电脑网页，手机网页）

通过浏览器访问AirDroid Web端【百度搜索AirDroid Web端】——建议使用谷歌Chrome浏览器，登录您的AirDroid帐号（需和手机端登录的帐号保持一致），点击远程控制图标，建立连接

三、qq浏览器远程调试微信内置浏览器

笔记|远程调试手机微信内置浏览器步骤

2022-05-18 15:41:15阅读 1.5K评论 2

在日常的开发、调试过程中，总会遇到各种针对移动端的适配问题。

已经逐渐成为了很多项目的重要适配对象。作为一款国民级应用，他的调试却并不像普通浏览器那样开放。

总要做一些奇奇怪怪的步骤才可以看到熟悉的控制台页面。

不管怎么说，有需求，总会有对应的办法来解决的。

普通手机浏览器调试步骤（Chrome）

Remote debug Android devices- Chrome Developers

Remote debug live content on an Android device from your Windows, Mac, or Linux computer. This tutorial teaches you how to:

Set up your Android device for remote debugging, and discover it from your development machine.

Inspect and debug live content on your Android device from your development machine.

Screencast content from your Android device onto a DevTools instance on your development machine.

Step 1: Discover your Android device

The workflow below works for most users. See Troubleshooting: DevTools is not detecting the Android device for more help.

Open the Developer Options screen on your Android. See Configure On-Device Developer Options.

在手机上面打开开发者调试功能（自行百度）（大多数手机为连点设备号即可进入）

在开发者调试功能内，选择启用 USB调试

On your development machine, open Chrome.

使用数据线连接电脑，并在电脑上打开 Chrome

（不出意外并且首次连接，会弹窗提示是否运行此计算机调试，选择允许即可）

Go to chrome://inspect#devices.

在上文打开的 Chrome中，打开地址：chrome://inspect#devices

若 Edge浏览器，可打开 edge://inspect/#devices

Make sure that the Discover USB devices checkbox is enabled.

勾选 Discover USB devices复选框（如下图）

确保你的手机已经成功连接了电脑，等待一会，你的设备会出现在上一步打开的页面。

Connect your Android device directly to your development machine using a USB cable. Your Android device may ask you to confirm that you trust this computer. The first time you do this, you usually see that DevTools has detected an offline device. If you see the model name of your Android device, then DevTools has successfully established the connection to your device. Continue to Step 2.

使用 USB电缆将您的 Android设备直接连接到您的开发机器。

您的 Android设备可能会要求您确认您信任这台计算机。

第一次执行此操作时，您通常会看到 DevTools检测到脱机设备。

如果您看到 Android设备的型号名称，则 DevTools已成功建立与您设备的连接。继续第 2步。

If your device is showing up as Offline, accept the Allow USB Debugging permission prompt on your Android device.

如果您的设备显示为离线，请在您的 Android设备上接受允许 USB调试权限提示。（如下图）

常见报错见 Remote debug Android devices- Chrome Developers

值得注意的是，连接模式改成 PTP也许会起作用。

Step 2: Debug content on your Android device from your development machine

Open Chrome on your Android device.

In the chrome://inspect/#devices, you see your Android device’s model name, followed by its serial number. Below that, you can see the version of Chrome that’s running on the device, with the version number in parentheses. Each open Chrome tab gets its own section. You can interact with that tab from this section. If there are any apps using WebView, you see a section for each of those apps, too. In Figure 5 there are no tabs or WebViews open.

打开 chrome://inspect/#devices，等待一会儿就看见设备了。

In the Open tab with url text box, enter a URL and then click Open. The page opens in a new tab on your Android device.

Click Inspect next to the URL that you just opened. A new DevTools instance opens. The version of Chrome running on your Android device determines the version of DevTools that opens on your development machine. So, if your Android device is running a very old version of Chrome, the DevTools instance may look very different than what you’re used to.

点击 Inspect，然后开始调试就行了。

参考链接：x5核心无法打开，安装内核提示“内核下载失败115→115”，请问有相同情况吗？|微信开放社区(qq.com)

在手机微信内部打开(此为移动端微信内置域名)

成功打开后即开启微信的远程调试功能

之后就和上文那个 Chrome浏览器一样的步骤了

本教程来源官方，经过测试微信调试页的出现时间比普通浏览器要长，所以耐心等待

此篇教程已经得到验证并且被方佬录入教程。

(我是在直播间传播的这个方法，后知后觉发现大家都不会？)

由于微信的浏览器更换了引擎，所以之前之前的方案不可用了

所以本教程还是算很新的，毕竟微信这几个月才刚换的内核，我在网上也没有搜到相关的帖子。

END，本文到此结束，如果可以帮助到大家，还望关注本站哦！