是否可以在 Android 手机上的 Chrome 中打开开发者工具控制台？

Posted 2023-03-07

【中文标题】是否可以在 Android 手机上的 Chrome 中打开开发者工具控制台？

【英文标题】：Is it possible to open developer tools console in Chrome on Android phone?

【发布时间】：2016-09-12 09:14:56

【问题描述】：

AngularJS 应用程序在桌面上运行良好，但在移动设备上无法正确呈现（显示实际代码）。这是在 android 手机上。

我想看看控制台中显示了哪些错误。

是否可以在移动设备上的 chrome 应用上打开 JS 控制台（就像在桌面上一样）？

【参考方案1】：

您可以使用远程调试来完成，这里是official documentation。基本流程：

连接你的安卓设备 选择您的设备：更多工具 > 通过 pc/mac 上的开发工具检查 devices*。 在您的手机上进行授权。 调试愉快！！

*现在是“远程设备”。

【讨论】：

我认为文档链接中提供了详细说明

在没有外部计算机的情况下是否可以做到这一点？

问题要求在 Android 手机上的 Chrome 中打开开发者工具控制台？您的灵魂需要单独的调试机器。在您的答案中，调试不在手机本身上

我没有其他方法知道@fennekin。如果您认为有更好的方法，请随时更新，

截至 2019 年 1 月，我无法在 More Tools 下找到 Inspect devices，我终于在 chrome://inspect 找到了它，您需要允许从手机进行 USB 调试

【参考方案2】：

我只想查看控制台中打印的内容，您可以简单地将“打印”部分添加到 html 中的某处，这样它就会出现在网页上。您可以自己做，但有一个 javascript 文件可以为您做这件事。你可以在这里阅读：

http://www.hnldesign.nl/work/code/mobileconsole-javascript-console-for-mobile-devices/

The code is available from Github;您可以下载它并将其粘贴到 javascipt 文件中，然后将其添加到您的 HTML 中

【讨论】：

仅供参考：您可能会遇到控制台不显示的情况。根据its official homepage末尾的一些对话，您可以尝试明确地mobileConsole.init()它。这个技巧对我有帮助。 YMMV。

该链接仍然有效，只是需要很长时间才能加载。尽管如此，我可以总结一下，我和那个 lib 所有者之间的那些对话最终导致他将以下信息添加到他主页的注释部分：“如果 mobileConsole 没有启动（移动检测失败），您可以通过设置覆盖自动启动overrideAutorun 为 true 或将以下脚本添加到您的页面：if (!mobileConsole.status.initialized) mobileConsole.init(); "

【参考方案3】：

当你手头没有电脑时，你可以使用 Eruda，它是移动浏览器的开发工具https://github.com/liriliri/eruda 它以可嵌入 javascript 和书签的形式提供（在 chrome 中粘贴书签会删除 javascript: 前缀，因此您必须自己输入）

【讨论】：

非常适合 Termux 之类的工具，它使单独的移动设备上的开发成为现实！我已经将eruda-webpack-plugin 集成到一个项目中：npm i eruba-webpack-plugin --save-optional。

获取控制台内容的最简单方法

很棒的解决方案。它在 CDN 中可用。

这似乎对我不起作用。将其粘贴到地址栏中（然后读取 'javascript:'）似乎没有任何作用。

@BT 一些网站限制从列出的允许域加载脚本。在其他网站上试试。

【参考方案4】：

请帮自己一个忙，点击简单按钮：

从 Play 商店下载 Web Inspector (Open Source)。

警告：ATTOW，控制台输出不接受其余参数！ IE。如果你有这样的事情：

console.log('one', 'two', 'three');

你只会看到

一个

登录到控制台。您需要手动将参数包装在一个数组中并加入，如下所示：

console.log([ 'one', 'two', 'three' ].join(' '));

查看预期的输出。

但应用是open source！补丁may be imminent！修补程序甚至可能是你！

【讨论】：

这是一个很好的起点，但不显示控制台日志

@skplunkerin 不确定您的意思？控制台日志输出：lh3.googleusercontent.com/…

哦，我以为只记录 XHR 请求，而不是所有控制台日志。谢谢！

这不叫rest params，只是变参函数/多个参数

链接现在是 404

【参考方案5】：

Kiwi 浏览器是移动版 Chromium，允许安装扩展程序。安装 Kiwi，然后安装“Mini JS 控制台”Chrome 扩展（只需在 Google 中搜索并从 Chrome 扩展网站安装，uBlock 也可以；）。它将在底部的 Kiwi 菜单中可用，并将显示当前页面的控制台输出。

【讨论】：

这很好，不是远程的！

【参考方案6】：

Remotely debugging Firefox 是另一种选择。步骤都提到了here

【参考方案7】：

使用远程调试 android中第一个活跃的开发者模式

1-in android>setting>搜索bulid number-->然后点击几次激活开发者模式

2- android>setting>开发者选项>启用usb调试

3-用usb线连接电脑

4-in chrome pc type chrome://inspect > enter

5- 在移动端打开 url 然后在 pc chrome://inspect/#devices 中监控

【讨论】：

最佳答案。

【参考方案8】：

原来的答案似乎不再有效。从当前的Chrome developer docs 开始，您需要完成以下基本步骤：

在您的 Android 上打开 开发者选项 屏幕。见Configure On-Device Developer Options。 选择启用 USB 调试。 在您的开发机器上，打开 Chrome。 转到chrome://inspect#devices。 确保发现 USB 设备复选框已启用。

之后，在您的 Android 设备上打开 Chrome（并确认 USB 调试提示以防弹出）。切换回您的 PC，您应该会看到当前打开的浏览器选项卡：

【讨论】：

为什么我无法打开 Chrome 直接从终端加载的 chrome://inspect#devices 页面，例如：$ chrome 'chrome://inspect#devices'?!

【参考方案9】：

试试OutFront JS

它将控制台消息记录到屏幕上。对调试移动浏览器很有帮助。

有帮助：

在移动浏览器中捕获警告、消息和错误。 适用于所有移动浏览器，包括中文浏览器。