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

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:链接用来提交这一信息。当然,该用户能够添加任何可能帮助捕获该错误的另外的信息。

时间: 2024-11-01 00:38:20

为AJAX应用程序构建一个错误提交系统的相关文章

AJAX错误提交系统源码示例

摘要 当一些应用程序崩溃时,它们往往向用户提供一个机会来提交关于该错误的信息.该信息能够帮助开发者追踪并修正错误.本文将向你展示如何在你的JavaScript/AJAX应用程序中实现这样的功能. 一. 引言 如果可以存取终端用户的计算机的话,那么终端用户的JavaScript错误就很容易调试.既然你不能实现这样的操作,那么你可以采取下面这样的措施:让用户向你发送你修正该问题需要的内容. 当象Mozilla浏览器这样的应用程序崩溃时,它们会启动一个错误提交程序.这些程序将询问用户是否愿意提交错误报

创建一个论文提交系统,怎样写提交论文下载论文?存储管理?预览PDF?给60分!每个问题单独解决都给20

问题描述 创建一个论文提交系统,怎样写提交论文下载论文的网页?存储管理?预览PDF?给60分1.怎样写提交和下载的界面?2.怎样管理下载后的论文?3.怎样在网页中预览pdf?每个问题单独解决都给20-30分我是小菜鸟,希望各位高手指教!拜托! 解决方案 解决方案二:up解决方案三:不方便给图解决方案四:用ASP.NET编写.1.页面上放置FileUpload控件(或html控件<inputtype='file'>也行),后台代码中读取该控件的信息,并使用相应的类进行保存等处理.FileUplo

submit-form表单提交后ajax异步调用另一个url

问题描述 form表单提交后ajax异步调用另一个url ... ... 提交Submit function submitForm(){ if(_finst_taskComment.value==""){ alert("请填写审批意见"); }else{ document.getElementsByTagName("form")[0].submit(); } } 另一个url如http://........ 解决方案 function submi

使用异步Servlet扩展AJAX应用程序--多路复用客户端套接字

作为Web应用程序模型的AJAX的出现使服务器端的面貌发生了巨大的变化.用户对着Web页面填写表单并单击提交按钮转到下一个链接的典型Web使用模式现在正在转变为更先进的客户端JavaScript以及功能更丰富的用户界面,只要对表单进行操作,比如单击一个复选框.按下一个键或将鼠标移到一个选项卡上,该用户界面就会不断地与服务器交互. 考虑一下从客户端传输到服务器的数据量有多大.从可用性的角度来看,用户在一个薄客户端浏览器上获得了富用户界面,无需安装任何东西.但是,当在服务器端扩展这些应用程序时就要付

使用异步Servlet扩展AJAX应用程序

ajax|servlet|程序|异步 <br /> 作为Web应用程序模型的AJAX的出现使服务器端的面貌发生了巨大的变化.<table border="0" cellspacing="0" cellpadding="0" align="left" style="margin-top:10px;margin-right:7px;margin-bottom:3px;margin-left:0px&qu

最优化跨浏览器Ajax应用程序

简介:如果所有的浏览器.计算机型号和 Ajax 应用程序的用户都一样,对开发人员来说,那真是妙 极了.但实际的情况是它们往往各不相同.在跨浏览器.计算机和单个用户设置方面开发行为可预知的 应用程序时,开发人员往往需要面对重重困难.当用户将 Ajax 应用程序从一个浏览器类型转换到另一 个浏览器类型时(尤其是在将 Ajax 应用程序传递给 Web 服务门户时),由于每个浏览器固有的限制, 无法保证拥有相同的浏览器体验.在本文中,作者 Judith Myerson 简单介绍了这些限制以及应该着重 避

如何在运维场景中构建一个优秀精准的异常检查系统

在实际的运维场景中,构建一个异常检测系统往往需要两个角色共同参与:领域专家和算法开发人员.领域专家也就是我们的运维人员,他们对KPI曲线的行为很熟悉,可以通过观察KPI曲线并结合自己的领域知识,判断KPI曲线是否出现异常:算法开发人员负责构建异常检测系统,他们熟悉异常检测器(算法),但是实际中有各种不同类型的KPI曲线需要维护,所以需要为不同类型的KPI曲线选择合适的异常检测器以及合适的算法参数. 在实际构建异常检测系统时,首先需要运维人员结合自己的领域知识向算法开发人员描述异常,然后开发人员根

Ajax技术:构建动态的Java应用程序

ajax|程序|动态 [导读]在本文中,作者Philip McCarthy介绍了通过后台通道的方法来创建动态Web应用的经验. Ajax(Asynchronous JavaScript and XML)是一个结合了Java技术.XML.以及JavaScript的编程技术,可以让你构建基于Java技术的Web应用,并打破了使用页面重载的惯例. Ajax,异步JavaScript与XML,是使用客户端脚本与Web服务器交换数据的Web应用开发方法.这样,Web页面不用打断交互流程进行重新加裁,就可以

使用jQuery和PHP构建一个受Ajax驱动的Web页面

大多数 PHP 开发人员都是以老式的方法学习技能.他们一般先学习如何定义和构建简单 的 PHP 页面,然后再了解如何将这些页面连接到简单的 MySQL 表,于是就可以由此进行自 己的开发了.随着技能水平的提高,他们还逐渐学会了如何创建更为复杂的 PHP 功能,以及 如何连接 MySQL 内的表并执行其他高级任务. 在这个过程中,他们有可能还会掌握 一些客户端技能来将 Web 应用程序投入使用.也有可能学会有关 XHTML 或 CSS 甚至一些 JavaScript 编程的知识.随着所参与项目的种