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

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
资源包主要包含以下内容: ASP项目源码:每个资源包中都包含完整的ASP项目源码,这些源码采用了经典的ASP技术开发,结构清晰、注释详细,帮助用户轻松理解整个项目的逻辑和实现方式。通过这些源码,用户可以学习到ASP的基本语法、服务器端脚本编写方法、数据库操作、用户权限管理等关键技术。 数据库设计文件:为了方便用户更好地理解系统的后台逻辑,每个项目中都附带了完整的数据库设计文件。这些文件通常包括数据库结构图、数据表设计文档,以及示例数据SQL脚本。用户可以通过这些文件快速搭建项目所需的数据库环境,并了解各个数据表之间的关系和作用。 详细的开发文档:每个资源包都附有详细的开发文档,文档内容包括项目背景介绍、功能模块说明、系统流程图、用户界面设计以及关键代码解析等。这些文档为用户提供了深入的学习材料,使得即便是从零开始的开发者也能逐步掌握项目开发的全过程。 项目演示与使用指南:为帮助用户更好地理解和使用这些ASP项目,每个资源包中都包含项目的演示文件和使用指南。演示文件通常以视频或图文形式展示项目的主要功能和操作流程,使用指南则详细说明了如何配置开发环境、部署项目以及常见问题的解决方法。 毕业设计参考:对于正在准备毕业设计的学生来说,这些资源包是绝佳的参考材料。每个项目不仅功能完善、结构清晰,还符合常见的毕业设计要求和标准。通过这些项目,学生可以学习到如何从零开始构建一个完整的Web系统,并积累丰富的项目经验。
资源包主要包含以下内容: ASP项目源码:每个资源包中都包含完整的ASP项目源码,这些源码采用了经典的ASP技术开发,结构清晰、注释详细,帮助用户轻松理解整个项目的逻辑和实现方式。通过这些源码,用户可以学习到ASP的基本语法、服务器端脚本编写方法、数据库操作、用户权限管理等关键技术。 数据库设计文件:为了方便用户更好地理解系统的后台逻辑,每个项目中都附带了完整的数据库设计文件。这些文件通常包括数据库结构图、数据表设计文档,以及示例数据SQL脚本。用户可以通过这些文件快速搭建项目所需的数据库环境,并了解各个数据表之间的关系和作用。 详细的开发文档:每个资源包都附有详细的开发文档,文档内容包括项目背景介绍、功能模块说明、系统流程图、用户界面设计以及关键代码解析等。这些文档为用户提供了深入的学习材料,使得即便是从零开始的开发者也能逐步掌握项目开发的全过程。 项目演示与使用指南:为帮助用户更好地理解和使用这些ASP项目,每个资源包中都包含项目的演示文件和使用指南。演示文件通常以视频或图文形式展示项目的主要功能和操作流程,使用指南则详细说明了如何配置开发环境、部署项目以及常见问题的解决方法。 毕业设计参考:对于正在准备毕业设计的学生来说,这些资源包是绝佳的参考材料。每个项目不仅功能完善、结构清晰,还符合常见的毕业设计要求和标准。通过这些项目,学生可以学习到如何从零开始构建一个完整的Web系统,并积累丰富的项目经验。
08-10
资源包主要包含以下内容: ASP项目源码:每个资源包中都包含完整的ASP项目源码,这些源码采用了经典的ASP技术开发,结构清晰、注释详细,帮助用户轻松理解整个项目的逻辑和实现方式。通过这些源码,用户可以学习到ASP的基本语法、服务器端脚本编写方法、数据库操作、用户权限管理等关键技术。 数据库设计文件:为了方便用户更好地理解系统的后台逻辑,每个项目中都附带了完整的数据库设计文件。这些文件通常包括数据库结构图、数据表设计文档,以及示例数据SQL脚本。用户可以通过这些文件快速搭建项目所需的数据库环境,并了解各个数据表之间的关系和作用。 详细的开发文档:每个资源包都附有详细的开发文档,文档内容包括项目背景介绍、功能模块说明、系统流程图、用户界面设计以及关键代码解析等。这些文档为用户提供了深入的学习材料,使得即便是从零开始的开发者也能逐步掌握项目开发的全过程。 项目演示与使用指南:为帮助用户更好地理解和使用这些ASP项目,每个资源包中都包含项目的演示文件和使用指南。演示文件通常以视频或图文形式展示项目的主要功能和操作流程,使用指南则详细说明了如何配置开发环境、部署项目以及常见问题的解决方法。 毕业设计参考:对于正在准备毕业设计的学生来说,这些资源包是绝佳的参考材料。每个项目不仅功能完善、结构清晰,还符合常见的毕业设计要求和标准。通过这些项目,学生可以学习到如何从零开始构建一个完整的Web系统,并积累丰富的项目经验。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值