AJax框架組件的核心是XMLHttpRequest JavaScript對象，它允許客戶端開發人員在不中斷用戶操作、不利用隱藏頁面的情況下，通過HTTP發送和接收XML文檔。現在，有些人可能會感到恐懼，因為它突然允許那些可能過多地使用了驗證窗體和動畫圖像的客戶端開發人員負責傳遞XML文檔和處理HTTP頭信息，但是，沒有風險就沒有收益。我們不用害怕，我將演示如何使用XMLHttpRequest來添加一些以前不可能的、行不通的特性，它同時還減少了錯誤，提高了產品質量。
JavaScript中的XMLHttpRequest和XML DOM
首先，我們需要建立一些規則。特殊的XMLHttpRequest對象和一般的XML DOM都受到了最新的浏覽器（IE、Mozilla、Safari、Opera）的廣泛支持，盡管在一般情況下，微軟對於自己的實現會稍微增加一些東西，需要某些特殊的處理。盡管我們更多的朋友直接實現了XMLHttpRequest，但是IE還是要求你用相同的屬性實例化一個ActiveXObject。在Apple開發者關系站點上可以找到相關的概述和所有特性列表。下面是一個基本的例子： 軟件開發網
var req;實際的例子：把客戶端錯誤傳遞到服務器上
現在我們知道了XMLHttpRequest和Javascript錯誤處理的一些基礎知識了，我們來看一個同時使用了兩者的實現例子。你可能認為JavaScript錯誤可以很簡單地在流行的"黃色死亡三角"中顯示出來，但是仍然有一些錯誤傳遞到了幾家籃籌股公司的公共web站點的質量部門了。
因此，我將提供一個用於捕捉錯誤並把錯誤記錄到服務器上的方法，這樣其他人就可能修補這些問題。首先，我們考慮客戶端。客戶端必須提供一個類，它被用作日志記錄器（Logger）對象，可以透明地處理各種細節信息。
下面是我們建立的構造函數：
// 類的構造函數
function Logger() {
// 字段
this.req;
// 方法
this.errorToXML = errorToXML;
this.log = log;
}
接下來，我們定義了一個方法，它會把Error對象序列化為XML。在默認情況下，Error對象只有兩種屬性，分別是name和message，但是我們還是使用了第三個屬性（location），它有時候是有用的。
軟件開發網
// 把錯誤映射到XML文檔中
function errorToXML(err) {
var xml = ’＜?XML version="1.0"?＞\n’
’＜error＞\n’
’＜name＞’ err.name ’＜/name＞\n’
’＜message＞’ err.message ’＜/message＞\n’;
if (err.location) XML = ’＜location＞’ err.location ’＜/location＞’;
XML = ’＜/error＞’;
return XML;
}
接著是log方法。這是腳本最基本的部分，它真正地實現了上述的原理。請注意，我們在調用中使用的是POST方法。從本質上說，我在此處建立的是一個定制的web服務，它是只讀的，並為每個成功的請求建立新記錄。因此，POST是唯一適當的選擇。
// 日志記錄類的log方法
function log(err) {
// 查看特性
if (window.XMLHttpRequest) this.req = new XMLHttpRequest();
else if (window.ActiveXObject) this.req =new ActiveXObject("Microsoft.XMLHTTP");
else return; // 失敗了
// 設置方法和URI
this.req.open("POST", "/cgi-bin/AJaxLogger.CGI");
// 設置請求頭信息。REFERER 是頂層URI，如果它發生在一個包含的.JS文件中
// 那麼它的位置與錯誤的位置可能不同
this.req.setRequestHeader(’REFERER’, location.href);
this.req.setRequestHeader(’content-type’, ’text/XML’);
// 請求完成的時候調用的函數
this.req.onreadystatechange = errorLogged;
this.req.send(this.errorToXML(err));
// 如果請求在10秒鐘內沒有完成，就出現一些錯誤消息
this.timeout = window.setTimeout("abortLog();", 10000);
}
類的最後一部分建立了一個Logger類實例。這個類應該只有一個實例。
http://www.mscto.com
// 只有一個日志記錄器實例
var logger = new Logger();
最後的兩個函數只是用於瑣碎事務管理的。如果在記錄錯誤的時候出現了問題，除了干擾用戶之外，我們幾乎不能做任務事務。但是，這種情況永遠不會出現。這些不是類的方法，因為事件沒有指向我們的對象的指針，但是它會指向我們建立的logger實例。
// 我們試過了，但是連接錯誤，沒有希望了
function abortLog() {
logger.req.abort();
alert("Attempt to log the error timed out.");
}
// 請求的狀態發生改變的時候調用
function errorLogged() {
if (logger.req.readyState != 4) return;
window.clearTimeout(logger.timeout);
// 請求完成了
if (logger.req.status ＞= 400)
alert(’Attempt to log the error failed.’);
}
前面的所有代碼都被包裝到一個.JS文件中了，我們可以在站點的任何（或每一個）頁面中包含這個文件。下面是如何包含這個文件的例子：
＜script type="text/Javascript" src="Logger.JS"＞＜/script＞
＜script type="text/Javascript"＞
function trapError(msg, URI, ln) {
// 在對象中包裝我們未知的錯誤
var error = new Error(msg);
error.location = URI ’, line: ’ ln; // 添加自定義屬性
logger.log(error);
warnUser();
return true; // 停止黃色三角形
}
window.onerror = trapError;
function foo() {
try {
riskyOperation();
} catch (err) {
//添加自定義屬性
err.location = location.href ’, function: foo()’;
logger.log(err);
warnUser();
}
}
function warnUser() {
alert("An error has occurred while processing this page." "Our engineers have been alerted!");
location.href = ’/path/to/error/page.Html’;
}
＜/script＞
現在你已經知道如何把日志記錄器集成到Html頁面中了，剩余的工作就是定義一種接收和轉換消息的方法了。我選擇使用最底層的通用命名方法，在Perl中建立了一個CGI腳本，這個腳本使用了我喜歡的一些模塊，它使用XML::Simple來分析post數據，使用CGI::Carp把結果直接導入到httpd錯誤日志，這樣可以節約系統管理員的時間，因為他不需要查看另外一個日志了。這個腳本還包含了很多良好的示例，它們適當地記錄了不同的成功和失敗條件。
use CGI;
use CGI::Carp qw(set_progname);
use XML::Simple;
my $request = CGI-＞new();
my $method = $request-＞request_method();
# 方法必須是POST
if ($method eq ’POST’) {
eval {
my $content_type = $request-＞content_type();
if ($content_type eq ’text/XML’) {
print $request-＞header(-status =＞’415 Unsupported Media Type’, -type =＞ ’text/XML’);
croak "Invalid content type: $content_type\n";
}
# 如果方法是POST，內容既不是URL編碼也不是多部分形式，
#那麼整個post會被填充到一個參數中：POSTDATA。
my $error_XML = $request-＞param(’POSTDATA’);
my $ref = XML::Simple::XMLin($error_XML);
my ($name, $msg, $location) =($ref-＞{’name’}, $ref-＞{’message’}, ’’);
$location = $ref-＞{’location’} if (defined($ref-＞{’location’}));
# 改變日志中的名字
set_progname(’ClIEnt-side error’);
my $remote_host = $request-＞remote_host();
carp "name: [$name], msg: [$msg], location: [$location]";
};
if ($@) {
print $request-＞header(-status =＞ ’500 Internal server error’,-type =＞ ’text/XML’);
croak "Error while logging: $@";
} else {
# 這部分響應代碼表明操作成功了，但是客戶端不應該期待任何內容
print $request-＞header(-status =＞ ’204 No content’,-type =＞ ’text/XML’);
}
} else {
軟件開發網
print $request-＞header(-status =＞ ’405 Method not supported’,-type =＞ ’text/XML’);
croak "Unsupported method: $method";
}
已經完成了！現在，當某些難以理解的JavaScript進入系統的時候，你就可以期待著自己的日志監視器開始閃紅燈，你的客戶端開發人員在深夜接到電話了。
