我怎样才能在Android上debuggingJavaScript？

我正在做一个涉及Raphaeljs的项目。 事实certificate，它不适用于Android。 它在iPhone上。

在Android浏览器上debugging某些东西到底是怎么回事？ 这是WebKit，所以如果我知道这个版本，那么在WebKit的完整版本上debugging它会产生相同的结果？

Answer 1

更新：远程debugging

以前，控制台日志logging是在Android上debuggingJavaScript的最佳select。 现在，通过Chrome进行Android远程debugging，我们可以充分利用Android上Chrome for Desktop开发人员工具的所有优点。 查看https://developers.google.com/chrome-developer-tools/docs/remote-debugging了解更多信息。;

---

更新：JavaScript控制台

您还可以导航到about：debug在URL栏中以激活debugging菜单和JavaScript错误控制台与最新的Android设备。 您应该在浏览器顶部看到SHOW JAVASCRIPT CONSOLE。

目前在Android 4.0.3（冰淇淋三明治），logcat输出到浏览器频道。 所以你可以使用adb logcat browser:* *:S进行过滤adb logcat browser:* *:S 。

---

原始答复

您可以使用内置的console JavaScript对象来打印可以使用adb logcat查看的日志消息。

 console.error('1'); console.info('2'); console.log('3'); console.warn('4') 

产生这个输出：

 D/WebCore ( 165): Console: 1 line: 0 source: http://... D/WebCore ( 165): Console: 2 line: 0 source: http://... D/WebCore ( 165): Console: 3 line: 0 source: http://... D/WebCore ( 165): Console: 4 line: 0 source: http://... 

确定WebKit的版本

如果在位置栏中键入javascript:alert(navigator.userAgent) ，则会看到列出的WebKit版本，例如

在Chrome： Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/532.2 (KHTML, like Gecko) Chrome/4.0.221.6 Safari/532.2

Android模拟器Mozilla/5.0 (Linux; U; Android 1.6; en-us; sdk Build/DRC76) AppleWebKit/528.5+ (KHTML, like Gecko) Version/3.1.2 Mobile Safari/525.20.1

NB

不属于Safari发行版的WebKit版本在版本号后有一个+，版本号通常比最新发布的WebKit版本高。 因此，例如，528+是WebKit的非官方版本，比Safari 3.1.2的一部分发布的525.x版本更新。

Answer 2

尝试：

1. 打开你想debugging的页面

2. 而在该页面上，在股票Android浏览器的地址栏中键入：

    about:debug 

   （注意什么都没有发生，但是一些新的选项已经被启用。）

在我尝试过的设备上工作。 有关Android浏览器的更多信息，请参阅：debug，这些设置有什么作用？

编辑：什么也有助于检索更多的信息，如行号是将此代码添加到您的脚本：

 window.onerror = function (message, url, lineNo){ console.log('Error: ' + message + '\n' + 'Line Number: ' + lineNo); return true; } 

Answer 3

http://jsconsole.com （ http://jsconsole.com/remote-debugging.html ）提供了一个很好的方式来访问网页的内容。

Answer 4

我使用Weinre ， Apache Cordova的一部分。

通过Weinre，我可以在我的桌面浏览器中获得Google Chrome的debugging控制台，并且可以将Android连接到该debugging控制台，以及debuggingHTML和CSS。 我可以在控制台执行Javascript命令，它们会影响Android浏览器中的网页。 来自Android的日志消息显示在桌面debugging控制台中。

不过，我认为不可能查看或逐步通过实际的Javascript代码。 所以我把Weinre与日志消息结合起来。

（我对JConsole不太了解，但是在我看来，使用JConsole，只有Javascript命令和日志logging（？），HTML和CSS检查是不可能的。）

Answer 5

看看jsHybugger 。 它将允许您远程debugging您的js代码：

• Android混合应用程序 （webview，phonegap，worklight）
• 在默认的Android浏览器中运行的网页 （不是Chrome浏览器，它不支持使用此工具的ADB扩展）

这是如何工作的（项目网站上有更多的细节和备选scheme，这是我发现的最好的方法）。

1. 在您的设备上安装jsHybugger APK
2. 在您的设备上启用USBdebugging。
3. 将Android设备通过USB插入桌面电脑
4. 在Android设备上运行应用程序（'jsHybugger'）
5. 在应用中input目标url和页面。 按开始服务，最后打开浏览器
   • 您将看到已安装的浏览器列表，请select一个。
   • 浏览器启动。
6. 回到台式电脑上打开Chrome浏览器chrome：// inspect /
7. 将出现一个检查器窗口，其中的chromedebugging工具链接到Android设备上的页面。
8. debugging了！

同样，Android上的Chrome使用不带jsHybugger的ADB扩展。 我想这已经在接受的这个问题的答案中描述过了。

Answer 6

仅供参考，RaphaelJS在android上不工作的原因是android webkit（不像iPhone webkit）目前不支持SVG。 谷歌最近才得出这样一个结论：SVG支持一个android是一个好主意，所以一段时间以后它将不可用。

Answer 7

Android 5.1.1上的Galaxy S6上的Android本机浏览器的全面Chrome远程debugging：

1. 在手机上启用USBdebugging（设置，关于，快速点击内部版本号，开发人员设置，USBdebugging）
2. 打开“Internet”
3. 导航到“about：debug”（你会看到一个错误）
4. 更多菜单>设置>debugging>远程debugging
5. 用USB线将手机连接到电脑
6. 在电话上，在互联网浏览器中，打开您要debugging的网站
7. 在电脑上打开Chrome
8. 导航到“chrome：//检查”
9. 点击您要检查的浏览器选项卡上的检查

Chrome浏览器显示Galaxy S5设备，但只有在重新启动后才会显示选项卡。 重新启动并尝试附加后，移动浏览器崩溃。

Answer 8

在3.0之前的Android浏览器中不支持Raphael，这就是你的问题所在。 他们不支持SVGgraphics。 它确实支持canvas。 如果你不需要animation，你可以使用canvg渲染graphics：

http://code.google.com/p/canvg/

这就是我们如何解决这个问题，以在默认的Android浏览器中呈现SVG图标。

Answer 9

放入地址行chrome://about 。 你会看到所有可能的开发页面的链接。

Answer 10

about:debug在Chrome上试用Chrome或Opera KitKat 4.4.2时，在Samsung Tab上尝试使用about:debug （或chrome:\\debug两者都表示无法find页面，但在设置中启用“debugging”菜单）

如果您的设备具有ROOT权限，则可以直接在设备上查看控制台消息。 使用CatLog这样的应用程序来查看日志输出 – https://play.google.com/store/apps/details?id=com.nolanlawson.logcat&hl=zh-CN这将让您查看所有的logcat活动。;

在Android KitKat / 4.4.2中，浏览器控制台输出到Chromium通道。 您可以通过“Chromium”进行过滤以获得所有浏览器活动（包括浏览器的内部活动），也可以通过“Console”进行过滤，只查看浏览器控制台日志。

 chromium [INFO:CONSOLE(3)] "The key "x-minimal-ui" is not recognized and ignored.", source http://mywebsite.com/ (3) 

Answer 11

你可以试试YConsole的一个jsembedded式控制台。 它重量轻，使用简单。

• 捕获日志和错误。
• 对象编辑器。

如何使用 ：

 <script type="text/javascript" src="js/YConsole-compiled.js"></script> <script type="text/javascript" >YConsole.show();</script> 

Answer 12

根据这个链接 ，javascriptdebugging可以通过下载链接中提到的firebug.js文件来完成，并将下载的文件加载到您的HTML页面中，以便您可以在没有任何诉诸Internet的情况下进行debugging。

Answer 13

我的解决scheme是（股票浏览器）：

• 股票浏览器
• 将“consolo.log”导入到JS源代码中
• debuggingUSB启用
• Android SDK
• 从Android SDK：monitor.bat
• 监视filter作为附加的图像

Answer 14

如果你正在构build一个“混合”应用程序（cordova），CrossWalk插件利用谷歌色彩networking视图，而不是android自带的标准互联网networking视图。 当我安装插件时，它具有debugging的能力。

人行横道

Answer 15

Android Studio提供了所有你需要看到的console.log等。 在logcat只是过滤到“/ Web控制台”，你会看到你的JS日志…

如果你有任何问题，你可以添加这个插件： https ： //github.com/apache/cordova-plugin-console

Answer 16

如果您正在寻找非远程选项：

在较早的和非根的Jellybean版本中，如果android.permission.READL_LOGS通过adb被授予一次，则可以使用logcat查看器。

在Firefox上，有一个控制台插件 ，读取和显示所有的应用程序日志，也有萤火虫精简版 。

Answer 17

mobile-console-log允许您从任何设备显示任何console.log到Chrome Devtools。