Question

在Google I/O 2011: Chrome Dev Tools Reloaded，保罗爱尔兰和帕维尔费尔德曼引入了新的remote debugging功能 - 该功能正在传递included into webkit。

-

这是个好消息，特别是对于移动网络开发者。但是我们如何启用它，例如启动IOS模拟器，或者只是在iPhone上运行Safari Mobile？ （对于chrome，传统上在启动时使用--remote-debugging-port=9222选项完成。）

我尝试在Safari设置中启用开发者模式（Settings＆gt; Safari＆gt; Developer＆gt; Debug Console: ON），但没有成功......

我不知道android在这里，但是有没有人知道Apple（Safari Mobile）或Google（android的浏览器）何时会包含这个新功能，所以我们可以在移动开发中享受远程调试？

谢谢。

参考：http://paulirish.com/2011/a-re-introduction-to-the-chrome-developer-tools/#comment-63113

Answer 1

iOS 6上的Safari 在iOS6中，您现在可以从Safari 6（仅限OS X）进行远程调试。在设备上，打开设置＆gt; Safari＆gt;高级＆gt;启用Web Inspector。打开Safari首选项，高级，选中“在菜单栏中显示开发菜单”。使用USB线连接iPhone / iPad。现在，在“开发”菜单栏下，您应该获得设备的子菜单，其中包含您在设备上的Safari中打开的选项卡。

iOS 7上的Safari 除了上述要求之外，您还需要Safari 6.1，目前（2013年10月8日）仅作为开发人员的种子提供：https://developer.apple.com/downloads/index.action?name=Safari%206.1

Android 4上的Chrome 这在Android上有点复杂。有关在Android版Chrome上进行远程调试的说明，请访问：https://developers.google.com/chrome/mobile/docs/debugging 我还没有找到在Android默认浏览器（v4.04）中启用远程调试的方法。

Answer 2

看一下这个bash脚本，用iOS模拟器启动远程检查器：https://gist.github.com/2241976

Answer 3

现在Chrome for Android支持它。

Answer 4

目前还没有移动浏览器实现webkit远程调试协议。（也许你可以获得支持它的Android自定义版本）

然而，有一个weinre，它为您提供了一个远程版本的Web检查器。但是您必须在页面中包含一些代码才能支持它。（因为它不是浏览器功能）。

Weinre website

Weinre github repo

Answer 5

Thomas指出了一个很好的远程调试资源，但是他说你需要将代码添加到网页中。这并不严格，因为我们还允许通过bookmarklet进行交互。在页面的下方here（在方便地称为“使用书签”的部分下），它表示它应该适用于Android 2.2+和iOS。

需要注意的一些相关事项：

它不允许您调试启动错误（必须加载页面才能打开书签）。
如果您失去连接，则似乎无法重新连接（您必须刷新页面才能再次建立连接）。
如果你的js已经坏了，它也会被打破。

也可以（我自己做过）使用webview从android浏览器“调试”代码。您可以让webview捕获所有方法调用（即console.log）。使用它可以捕获并保存或转发消息到logcat。

与您已经尝试过的方法相关 - 当您在iOS上启用调试控制台时，您在哪里寻找交互/日志记录输出？更具体地说，您是否在xCode / iPhone模拟器中检查了调试控制台？

Answer 6

仅仅因为某个功能在WebKit的一个端口（在本例中为Apple和Chromium）中实现，并不意味着它总是在其他地方可用。我在关于different WebKit ports implementation的博文中详细写了这篇文章。

到目前为止，唯一具有远程调试功能的移动WebKit端口是RIM Playbook浏览器。

对于iOS，很难知道，因为Apple没有提供有关其未来产品的任何信息。至少我们知道iOS 5不会有它，因为测试版没有显示任何相关内容。

对于Android，肯定会在未来版本中出现，因为Android人员adopting Chromium是其WebKit的新基础。

Answer 7

Nathan de Vries想出了如何在模拟器中运行的iOS5上执行此操作。它围绕调用私有_enableRemoteInspector方法。

阅读它。摘要如下：

要为Mobile Safari启用此功能，请使用gdb附加到它并调用方法：

MobileSafari_PID=$(ps x | grep "MobileSafari" | grep -v grep | awk '{ print $1 }')

if [ "$MobileSafari_PID" == "" ]; then
  echo "Mobile Safari.app must be running in the Simulator to enable the remote inspector."
else

  cat <<EOM | gdb -quiet > /dev/null
  attach $MobileSafari_PID
  p (void *)[WebView _enableRemoteInspector]
  detach
EOM

网络连接

然后访问http://localhost:9999/处的检查员。

使用嵌入式UIWebView，启用它如下：

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
  // ...Snipped...
  [NSClassFromString(@"WebView") _enableRemoteInspector];
  // ...Snipped...
}

在真实设备上它不起作用，可能是因为该端口是防火墙 - 如果你有一个越狱设备，你可能会绕过它（如果你这样做，请更新我们）。

Answer 8

Adobe的Shadow实用程序（刚刚发布）允许您使用weinre远程调试，而无需在网页中注入任何代码。它适用于Windows和Mac上的Chrome作为“主”浏览器，并将每个页面导航同步到运行iOS或Android客户端的任意数量的设备。

请注意，我们自己有点受限。例如，您将无法访问“网络”选项卡。

使用webkit远程调试启动移动浏览器

8 个答案: