為AJAX應用程序構(gòu)建一個錯誤提交系統(tǒng)

2024-07-21 02:28:35

字體：大中小

供稿：網(wǎng)友

商業(yè)源碼熱門下載www.html.org.cn

　　摘要當一些應用程序崩潰時，它們往往向用戶提供一個機會來提交關(guān)于該錯誤的信息。該信息能夠幫助開發(fā)者追蹤并修正錯誤。本文將向你展示如何在你的javascript/ajax應用程序中實現(xiàn)這樣的功能。

　　一、引言

　　如果可以存取終端用戶的計算機的話，那么終端用戶的javascript錯誤就很容易調(diào)試。既然你不能實現(xiàn)這樣的操作，那么你可以采取下面這樣的措施：讓用戶向你發(fā)送你修正該問題需要的內(nèi)容。

　　當象mozilla瀏覽器這樣的應用程序崩潰時，它們會啟動一個錯誤提交程序。這些程序?qū)⒃儐栍脩羰欠裨敢馓峤诲e誤報告。如果用戶愿意的話，該程序?qū)⒁笏麄冚斎胗嘘P(guān)他們的程序崩潰時的盡可能多的信息。這個信息，連同該錯誤提交程序自己的分析數(shù)據(jù)，一同提交到電子郵件中心以便開發(fā)人員和工程經(jīng)理讀取分析。

　　這種功能對于開發(fā)者是極其有用的。既然該程序運行于客戶端機器上，這是唯一取得有關(guān)于開發(fā)者不能在他們自己的開發(fā)系統(tǒng)上重新生成相同的錯誤信息的方式。他們還能夠監(jiān)視該特定的錯誤的頻率和嚴重性以便決定應該首先修正哪些錯誤。

　　本文將向你展示如何在javascript/ajax程序中支持這種錯誤提交功能。當在你的代碼中發(fā)生一個錯誤時，該系統(tǒng)將彈出一個用戶能夠提交錯誤信息的窗口。

　　二、問題

　　如何在我的javascript/ajax應用程序中安裝一個用戶錯誤提交程序？

　　三、解答

　　把代碼放到一個包裝程序中，該包裝程序允許用戶提交一個包含詳細錯誤信息的電子郵件。

　　(一) 捕獲錯誤

　　下列文件被包括在本文相應的下載源代碼中，你可以利用它們來實現(xiàn)上面的解決方案：

　　·talkback.js-這個文件包括本系統(tǒng)的完整源碼

　　·test.html-一個使用talkback.js來處理一個發(fā)現(xiàn)錯誤的示例腳本

　　這里的test.html頁面包含一些javascript代碼，其中拋出一個異常。這個頁面把函數(shù)fun_a()安裝為body部分的onload處理器。該fun_a()函數(shù)又調(diào)用fun_b()，fun_b()又調(diào)用fun_c()。最后，fun_c()存取一個不存在的對象中的不存在的域，并觸發(fā)一個真正的javascript異常。

　　首先，在用戶能夠看到這個錯誤之前你需要捕獲它。這樣以來，你就能夠使用戶有一個機會來提交錯誤信息；但是，你不想讓他或她的看到任何其它內(nèi)容。我們的目標是盡量減少該錯誤向用戶暴露的內(nèi)容。

　　這是很容易實現(xiàn)的。假定主程序可以經(jīng)由下列函數(shù)激活：

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

　　請注意這里對tb_wrap()的調(diào)用。這樣以來，就可以把fun()函數(shù)放到一個能夠捕獲任何異常并且處理它們的包裝器中。而且，這樣以來，該用戶就不會看到任何發(fā)生在fun()中的異常。

　　(二) 收集錯誤信息

　　一旦你捕獲了錯誤，那么你需要提取盡可能多的信息。你把越多的錯誤數(shù)據(jù)發(fā)送回開發(fā)者，他們越有可能發(fā)現(xiàn)并修正該錯誤。

　　遺憾的是，根據(jù)用戶運行的瀏覽器不同，錯誤對象具有不同的屬性。大多數(shù)情況下，你能夠依賴name和message屬性。注意，stack屬性中包含一個極其有用的棧蹤跡，只是它僅可用于最近版本的基于mozilla的瀏覽器中。

　　(三) 創(chuàng)建一個mailto:鏈接

　　為了使用戶能夠向你發(fā)送關(guān)于該錯誤的信息，你應該提供給他們一個他們能夠點擊的鏈接。這樣很好，因為它讓這些用戶自己決定愿不愿意受麻煩，而且他們能夠避免發(fā)送多份相同的錯誤報告。

　　這個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

　　用戶能夠添加他們喜歡的另外的任何信息，然后發(fā)送該消息。

　　(四) 實現(xiàn)細節(jié)

　　下面這些函數(shù)定義在talkback.js文件中：

　　◆tb_wrap(fun)-這個函數(shù)負責把函數(shù)fun放到一個包裝器中，由該包裝器捕獲任何異常并且向用戶提供一個機會來把這些錯誤發(fā)送回開發(fā)者。當發(fā)生一個異常時，它把該錯誤對象添加到一個異常列表并且向該用戶提供一個提交鏈接。如果任何更深的異常發(fā)生，那么它將把它們添加到異常列表和提交鏈接。

　　◆tb_show_talkback_link()-這個函數(shù)顯示一個小型浮動窗口，它能夠向用戶提供一個機會來提交一個錯誤："an error has occurred in this page. to report this error， please click here: report error"。

　　·這個窗口僅在第一次發(fā)生異常時出現(xiàn)，并且它停在其它窗口內(nèi)容之一。如果更深的異常發(fā)生，那么它們的信息會被添加到現(xiàn)有的mailto:鏈接上。

　　·tb_set_link_contents()-在每次拋出一個異常時，都把它添加到一個列表上。然后，掃描整個列表以發(fā)現(xiàn)有用的信息，然后把該信息打包到一個mailto:鏈接中。當在第一次拋出異常時顯示這個鏈接，然后一直顯示。

　　四、小結(jié)

　　現(xiàn)在，開發(fā)者正在越來越多地使用javascript和ajax技術(shù)創(chuàng)建具有豐富特征的應用程序。因此，對于應用程序級支持的需要也相應地增長。本文中提供的這個小型回饋系統(tǒng)可能有助于搜集到有關(guān)一個錯誤的盡可能多的信息并且向用戶提供一個mailto:鏈接用來提交這一信息。當然，該用戶能夠添加任何可能幫助捕獲該錯誤的另外的信息。

上一篇：WebService服務和ajax使用教程

下一篇：使用AJAX技術(shù)構(gòu)建更優(yōu)秀的Web應用程序