iOS 6 - 删除了 iPad 的控制台日志 - 如何在 Windows 上使用 Web 检查器？

Question

iOS6 已经出来了，天啊。现在，苹果似乎已经删除了 Safari 中曾经存在的“开发者控制台”。太好了，我听到很多人说 - 它是有限的。

但是，它可以在设备上工作 - 现在显然您必须将设备连接到 Mac 才能获取 Web 检查器？

这是使用控制台进行调试的唯一方法吗？有没有办法用windows、safari进行调试？请注意，我的意思并不是仅仅更改用户代理，您可以在 Safari Windows 上执行此操作 - 它不会注册触摸事件 - 只需单击即可。

Answer 1

如果您没有 Mac OSX，您可以使用此脚本作为控制台替代品：

https://github.com/robotnic/waterbug

它显示错误消息，可以记录所有类型的变量，你必须将你的iPhone或iPad向右旋转90°才能打开控制台。

Answer 2

穷人的调试控制台：

    try {
        var test = document.do.something();
    }
    catch (exc) {
        alert(exc);
    }

Answer 3

可以使用书签（尤其是在 Mobile Safari 中）在设备上进行调试。

如果错误仅出现在设备上而不出现在其他地方，则设备上的调试可能非常重要。有多种供开发人员使用的书签，因此请选择您喜欢的工具（例如 Firebug Lite），将其添加到您的书签中并在您需要的地方使用它。 这可能不是开发者控制台，但它是一种更准确且面向工作的调试方法。

我在我的博客上写了一篇关于如何使用小书签的博文（还有其他常见测试工具和更多小书签的列表）：

http://hofmannsven.com/2013/laboratory/ios-bookmarklets/

• 更新：Chrome 发布了其移动开发工具，这将使调试（在 Google Chome Mobile 中，
仅限 Android 设备

）变得更加容易。这不会修复 Safari 中缺少 DevTools 的问题，但可能有助于定位设备

上的错误： https://developer.chrome.com/devtools/docs/remote-debugging

• http://www.html5rocks.com/en/tutorials/developertools/mobile/
• 更新2：Mozilla 发布了一个 Firefox 插件，支持跨浏览器和设备的 Web 开发：http://youtu.be/kEFbQwB81RE?t=1m58s

看看 weinre。它允许您使用类似 Chrome 的 Web 检查器从另一台计算机检查 Safari 中运行的页面

Answer 4

您可以使用

Answer 5

在没有控制台的情况下调试错误。只需将此代码添加到您的 HTML 文档中，在其自己的 <script>

 标记中，然后再添加任何其他 Javascript 代码即可：

<script type="text/javascript">
    window.onerror = function(e){
        alert(e);
    };
</script>

这样，每当出现错误时，错误消息都会显示在

alert

 对话框中，该对话框在 iOS Safari 中可见。重要的是上面的代码在您尝试调试的错误之前运行，并且如果您正在调试语法错误，那么它位于单独的 

<script>

标记中也很重要。

您可以使用 Telerik 的一款名为 AppBuilder 的应用程序来代替 Windows 上的 Safari。我在

此博客

Answer 6

这将为您提供类似于 Safari 中的开发工具。我在 Win7 64 位上使用它，并在运行 iOS 7.1 的 iPad 上运行常规 Web 应用程序和 Phonegap 应用程序。

就像 neno 所建议的那样，Telerik AppBuilder 是一个很棒的应用程序。实际上，我在 Linux 上的虚拟机中运行 Windows XP 只是为了调试我的 iPhone。 Windows XP，因为在我的例子中，Windows 7 确实可以识别 iPhone，但 iTunes 和 Telerik AppBuilder 不能。

Answer 7

看起来内置控制台不见了。我尝试插入 Windows 7 并打开 Safari，但找不到开发人员控制台。然后我读了

这篇文章

Answer 8

如果您需要能够在两个方向上测试您的站点，那么 Waterbug 不是一个好的选择，因为它占用了控制台视图的横向方向。 一个不错的选择是使用

Adobe Edge Inspect

。您在 Chrome 上打开您的网站，然后在您的设备上打开该应用程序，您的设备将镜像您在桌面上打开的任何页面。然后您可以使用 Chrome 开发工具来调试您的内容。