Web应用调试：现在是Weinre和JSConsole，最终会是WebKit的远程调试协议

作者 Werner Schuster 译者 杨晨 发布于 2011年8月6日

领域

架构 & 设计,

语言 & 开发

主题

Ruby ,

JavaScript ,

Java ,

动态语言 ,

调试器 ,

语言 ,

.NET ,

调试 ,

编程 ,

移动 ,

Opera ,

IDE ,

Chrome ,

黑莓

分享到

随着智能手机和平板电脑的越来越流行，这对于开发者来说意味着网站需要进行优化，或者适应移动浏览器。但是在移动平台上的调试工具却一直处于功能贫血状态；现代的桌面浏览器装备了功能强大的JavaScript和DOM调试器，以及性能剖析器。而在移动平台上，调试方法却只能使用alert()弹出对话框或者登录到控制台来查看代码执行的位置以及变量的状态；检查DOM或者CSS的状态是非常困难的，甚至是不可能完成的任务。

有一些工具在弥补浏览器的这些不足，与此同时，浏览器厂商也在改进这种情况，它们在向浏览器中加入调试器以及远程调试支持。

现状：移动调试的变通方案

这些变通方案和未来的移动调试支持有一个共同点：它们是远程工作；调试不会真正发生在移动设备上，而是在其他机器上通过网络连接了一个调试的GUI。

其中一个工具就是Weinre，这个工具是由Patrick Mueller开发，现在已经是PhoneGap项目的一部分了。Weinre的调试功能是使用JavaScript编写，而且必须包含在调试目标的代码中，例如需要调试的HTML页面。Weinre需要一个服务器来连接到调试目标，并且将消息转发给调试器GUI。这个调试器GUI基本上就是一个由HTML和JavaScript编写的WebKit的Web Inspector。

Weinre能够做什么？一旦调试目标连接到调试器GUI，用户可以从终端输出中查看调试目标的代码输出以及在调试目标的环境中对JavaScript代码求值。Weinre同样也支持调试目标的DOM和CSS查看和修改。

有些缺失的功能是需要VM支持，例如设置和捕捉断点以及相关功能，当然还有性能剖析器。

PhoneGap是一个跨平台的架构，它允许应用程序使用HTML/JavaScript作为GUI，并且仍然能够访问本地API。将Web调试变得更加容易是PhoneGap的使命之一，于是，Weinre现在成为了PhoneGap项目的一部分。

JSConsole是一个风格和Weinre类似的工具，它更多地关注于控制台输出和代码求值。在访问JSConsole的网站的时候，用户输入“:listen”来获得带有GUID的一段JavaScript代码。这段代码需要被加入到待调试的网页中。于是，在加载网页的时候，代码将会连接到JSConsole服务器，并且根据GUID将此会话和用户的会话关联起来，于是用户浏览器中的控制台现在便已经处于待调试网页的JavaScript运行时环境中了。

iOS用户安装一些应用来访问JavaScript运行时环境，例如JSConsole app或者Bugaboo。

未来：远程调试

这些变通方案允许用户访问移动浏览器中的JavaScript运行时环境来观察和交互 - 只在一定的程度。但是，开发者需要使用桌面浏览器所拥有的强大的调试工具：多种断点（基于行的或者是异常触发，亦或是DOM改变时触发），剖析器等更多功能。

解决方案是将调试功能引入到移动运行时环境中，于是这样就能够通过远程协议进行调试。

Javascript, DOM, CSS, etc, whereas the V8 protocol only supports the Javascript functionality.

WebKit项目近期宣布了支持远程调试，这就意味着可以通过网络协议来访问运行时环境并且调试，并且调试器GUI可以是另外一个进程，或者运行在另外一台机器上。这个功能在一些浏览器和JavaScript引擎上已经有一定程度的支持，因为允许第三方调试器GUI来帮助用户连接到调试环境的调试器是非常重要的。Firefox正在开发CrossFire，这是一个支持调试功能的协议，而且Google的V8引擎也有自己的远程调试协议，这个协议已经被用在一些IDE中，例如Cloud9的Chrome调试器和Node.js工具。不过，我们也要注意到，CrossFire和WebKit的新协议都对Web调试特性提供了广泛的支持。例如JavaScript、DOM和CSS等，但是V8的协议只是支持了JavaScript的调试功能。

一旦移动JavaScript运行时环境和HTML组件支持了这些远程协议，它们的调试能力不会亚于任何一个桌面浏览器。

如果真是如此，将会是什么样呢，我们可以从一些已经支持这些协议的平台上看出一些端倪。一个例子就是Blackberry在Playbook平板电脑上的远程调试支持，它包含了WebKit中最新的WebInspector和远程调试特性。

Opera的移动浏览器也通过DragonFly调试器来支持远程调试。我们需要注意，Opera Mobile是一个功能齐备的浏览器，而Opera Mini只是简单地展示在服务器已经渲染好的HTML文件以及中转用户事件。

仍然值得期待的是，Android和iOS上的浏览器在什么时候会跟进并且支持远程调试。

你是否在使用我们没有提及过的调试工具呢？

查看英文原文：Debugging Mobile Web Apps: Weinre and JSConsole Now, Remote WebKit Eventually

译者 杨晨 对数据库和搜索引擎有深入了解，尤其擅长经典计算机科学理论，对历史学兴趣浓厚。

相关厂商内容

保持某些系统的高可用性，是一些企业的重中之重，如何设计？

海量数据处理，海量视频分发，架构热点难点，尽在架构师峰会！

相关赞助商

ArchSummit全球架构师峰会报名启动！7折优惠，5月31日截止！