为AJAX应用程序构建一个错误提交系统

摘要  当一些应用程序崩溃时，它们往往向用户提供一个机会来提交关于该错误的信息。该信息能够帮助开发者追踪并修正错误。本文将向你展示如何在你的JavaScript/AJAX应用程序中实现这样的功能。

　　一、 引言

　　如果可以存取终端用户的计算机的话，那么终端用户的JavaScript错误就很容易调试。既然你不能实现这样的操作，那么你可以采取下面这样的措施：让用户向你发送你修正该问题需要的内容。

　　当象Mozilla浏览器这样的应用程序崩溃时，它们会启动一个错误提交程序。这些程序将询问用户是否愿意提交错误报告。如果用户愿意的话，该程序将要求他们输入有关他们的程序崩溃时的尽可能多的信息。这个信息，连同该错误提交程序自己的分析数据，一同提交到电子邮件中心以便开发人员和工程经理读取分析。

　　这种功能对于开发者是极其有用的。既然该程序运行于客户端机器上，这是唯一取得有关于开发者不能在他们自己的开发系统上重新生成相同的错误信息的方式。他们还能够监视该特定的错误的频率和严重性以便决定应该首先修正哪些错误。

　　本文将向你展示如何在JavaScript/AJAX程序中支持这种错误提交功能。当在你的代码中发生一个错误时，该系统将弹出一个用户能够提交错误信息的窗口。

　　二、 问题

　　如何在我的JavaScript/AJAX应用程序中安装一个用户错误提交程序？

　　三、 解答

　　把代码放到一个包装程序中，该包装程序允许用户提交一个包含详细错误信息的电子邮件。

　　(一) 捕获错误

　　下列文件被包括在本文相应的下载源代码中，你可以利用它们来实现上面的解决方案：

　　·talkback.js-这个文件包括本系统的完整源码

　　·test.html-一个使用talkback.js来处理一个发现错误的示例脚本

　　这里的test.html页面包含一些JavaScript代码，其中抛出一个异常。这个页面把函数fun_a()安装为body部分的onload处理器。该fun_a()函数又调用fun_b()，fun_b()又调用fun_c()。最后，fun_c()存取一个不存在的对象中的不存在的域，并触发一个真正的JavaScript异常。

　　首先，在用户能够看到这个错误之前你需要捕获它。这样以来，你就能够使用户有一个机会来提交错误信息；但是，你不想让他或她的看到任何其它内容。我们的目标是尽量减少该错误向用户暴露的内容。

　　这是很容易实现的。假定主程序可以经由下列函数激活：

function fun()
{
　//程序在此.
}
fun = tb_wrap( fun);

　　请注意这里对tb_wrap()的调用。这样以来，就可以把fun()函数放到一个能够捕获任何异常并且处理它们的包装器中。而且，这样以来，该用户就不会看到任何发生在fun()中的异常。

　　(二) 收集错误信息

　　一旦你捕获了错误，那么你需要提取尽可能多的信息。你把越多的错误数据发送回开发者，他们越有可能发现并修正该错误。

　　遗憾的是，根据用户运行的浏览器不同，错误对象具有不同的属性。大多数情况下，你能够依赖name和message属性。注意，stack属性中包含一个极其有用的栈踪迹，只是它仅可用于最近版本的基于Mozilla的浏览器中。
　　(三) 创建一个Mailto:链接

　　为了使用户能够向你发送关于该错误的信息，你应该提供给他们一个他们能够点击的链接。这样很好，因为它让这些用户自己决定愿不愿意受麻烦，而且他们能够避免发送多份相同的错误报告。

　　这个mailto:链接能够打开用户的电子邮件程序，然后就象下面这样填充邮件的Subject和Body域：

Subject: Error from http://myserver.com/myapp/index.cgi?id=234
Body:

ReferenceError: nonexistent_variable is not defined
fun_c()@http://myserver.com/myapp/index.cgi?id=234:19
fun_b()@http://myserver.com/myapp/index.cgi?id=234:14
fun_a()@http://myserver.com/myapp/index.cgi?id=234:9
apply(null，[object Object])@:0
()@http://myserver.com/myapp/livedebug.js:106
onload([object Event])@:0 @:0

　　用户能够添加他们喜欢的另外的任何信息，然后发送该消息。

　　(四) 实现细节

　　下面这些函数定义在talkback.js文件中：

　　◆tb_wrap(fun)-这个函数负责把函数fun放到一个包装器中，由该包装器捕获任何异常并且向用户提供一个机会来把这些错误发送回开发者。当发生一个异常时，它把该错误对象添加到一个异常列表并且向该用户提供一个提交链接。如果任何更深的异常发生，那么它将把它们添加到异常列表和提交链接。

　　◆tb_show_talkback_link()-这个函数显示一个小型浮动窗口，它能够向用户提供一个机会来提交一个错误："An error has occurred in this page. To report this error， please click here: Report Error"。

　　·这个窗口仅在第一次发生异常时出现，并且它停在其它窗口内容之一。如果更深的异常发生，那么它们的信息会被添加到现有的mailto:链接上。

　　·tb_set_link_contents()-在每次抛出一个异常时，都把它添加到一个列表上。然后，扫描整个列表以发现有用的信息，然后把该信息打包到一个mailto:链接中。当在第一次抛出异常时显示这个链接，然后一直显示。

　　四、 小结

　　现在，开发者正在越来越多地使用JavaScript和AJAX技术创建具有丰富特征的应用程序。因此，对于应用程序级支持的需要也相应地增长。本文中提供的这个小型回馈系统可能有助于搜集到有关一个错误的尽可能多的信息并且向用户提供一个mailto:链接用来提交这一信息。当然，该用户能够添加任何可能帮助捕获该错误的另外的信息。