Ajax Error Submission System source code example

Source: Internet
Author: User
Tags add object end functions html page implement object object window
SummaryWhen some applications crash, they often give the user an opportunity to submit information about the error. This information can help developers track and fix bugs. This article will show you how to implement this functionality in your Javascript/ajax application.

   first, the introduction

If you can access the end user's computer, the end user's JavaScript error is easy to debug. Now that you can't do this, you can take the following steps: Ask the user to send you what you need to fix the problem.

When applications like Mozilla browser crash, they start an error-submitting program. These programs will ask the user if they want to submit an error report. If the user wants to, the program will ask them to enter as much information as possible about the crash of their program. This information, together with the error-submitting program's own profiling data, is submitted to the email center so that developers and engineering managers can read the analysis.

This functionality is extremely useful for developers. Now that the program is running on the client machine, this is the only way to get the same error message that developers cannot regenerate on their own development systems. They can also monitor the frequency and severity of the particular error to determine which errors should be corrected first.

This article will show you how to support this error-submission feature in the Javascript/ajax program. When an error occurs in your code, the system pops up a window in which the user can submit an error message.

   Ii. Issues

How do I install a user error-submission program in my Javascript/ajax application?

   third, answer

Put the code in a wrapper that allows the user to submit an e-mail message with a detailed error message.

(i) Catch errors

The following files are included in the corresponding download source code in this article, and you can use them to implement the above solution:

talkback.js-This file includes the complete source code of the system

test.html-A sample script that uses Talkback.js to handle a discovery error

The test.html page here contains some JavaScript code that throws an exception. This page installs the function fun_a () as the OnLoad processor in the body section. The fun_a () function calls Fun_b () again, and Fun_b () calls Fun_c (). Finally, Fun_c () accesses a nonexistent domain in an object that does not exist and triggers a real JavaScript exception.

First, you need to capture this error before the user can see it. In this way, you can give the user an opportunity to submit an error message, but you don't want him or her to see anything else. Our goal is to minimize the content that this error exposes to the user.

This is very easy to achieve. Assume that the main program can be activated through the following functions:

function Fun ()
{
program here.
}
Fun = Tb_wrap (fun);

Note the invocation of Tb_wrap () here. This allows the fun () function to be placed in a wrapper that captures any exceptions and processes them. Also, the user will not see any exceptions that occur in fun ().

(ii) collection of error messages

Once you have caught the error, you need to extract as much information as possible. The more error data you send back to the developer, the more likely they are to discover and fix the error.

Unfortunately, the Error object has different properties depending on which browser the user is running. In most cases, you can rely on the name and message properties. Note that the Stack property contains an extremely useful stack trail, except that it is available only in the most recent version of the Mozilla based browser.

(iii) Create a mailt link

To enable users to send you information about the error, you should provide them with a link that they can click on. This is good because it lets these users decide whether they want to be bothered, and they can avoid sending multiple copies of the same error report.

This mailt link opens the user's e-mail program, and then populates the subject and body fields of the message as follows:

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

Users can add any additional information they like, and then send the message.

( IV) Implementation details

The following functions are defined in the Talkback.js file:

Tb_wrap (fun)-This function is responsible for putting the function fun in a wrapper, by which the wrapper catches any exceptions and gives the user an opportunity to send the errors back to the developer. When an exception occurs, it adds the Error object to an exception list and provides a submit link to the user. If any deeper anomalies occur, it will add them to the list of exceptions and submit links.

Tb_show_talkback_link ()-This function displays a small floating window that provides the user with an opportunity to submit an error: ' An error has occurred in the this page. To the "the" error, please click Here:report error.

• This window only appears when an exception occurs for the first time, and it stops in one of the other window contents. If deeper anomalies occur, their information is added to the existing mailt link.

tb_set_link_contents ()-adds it to a list each time an exception is thrown. Then, scan the entire list to find useful information, and then package the information into a mailt link. Displays the link when the exception is first thrown, and then displays it all the time.

   Iv. Summary

Now, developers are increasingly using JavaScript and Ajax technologies to create rich-featured applications. As a result, the need for application-level support also grows accordingly. This small feedback system, provided in this article, may help to gather as much information about an error as possible and provide the user with a mailt link to submit this information. Of course, the user is able to add any additional information that might help catch the error.


Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.