即使你現在還沒有聽說,AJAX已經成為web技術領域最熱門的詞。AJAX框架的關鍵是名為 XMLHttpRequest 的 JavaScript 對象,通過它客戶端開發人員可以在不打斷用戶操作或者在充分使用隱藏表單的情況下通過 HTTP 直接發送和接收XML文檔。現在,有些人可能會有這種憂慮,讓那些以前只做表單(form)校驗和增加圖片動畫效果的客戶端開發人員突然間負責分析 XML 文檔結構,以及與 HTTP 協議的 header 部分打交道,這能行嗎?但是,沒有風險就沒有回報。為了減輕這種疑惑,我將展示如何使用 XMLHttpRequest 實現以前無法實現功能,同時如何減少程序錯誤和如何提高程序質量。
XMLHttpRequest 和 XML DOM 的 JavaScript 基礎
首先,我們需要聲明一些規則。現在常用的浏覽器(IE, Mozilla, Safari, Opera)都特別提供了對 XMLHttpRequest 對象的支持,同時也廣泛支持 XML DOM,雖然和往常一樣:微軟(Microsoft)使用了一種稍微有些不同的實現並有一些需要特殊注意的地方。和我們那些更進取的朋友直接實現 XMLHttpRequest 不同,IE需要你創建一個具有相同屬性的 ActiveXObject 對象的實例。Apple Developer Connection 網站上有一篇非常好的文章總覽了 XMLHttpRequest,並列舉了它的全部特性。
下面是個基礎的例子:
var req;
function postXML(xmlDoc) {
if (window.XMLHttpRequest) req = new XMLHttpRequest();
else if (window.ActiveXObject) req = new ActiveXObject("Microsoft.XMLHTTP");
else return; // fall on our sword
req.open(method, serverURI);
req.setRequestHeader('content-type', 'text/xml');
req.onreadystatechange = xmlPosted;
req.send(xmlDoc);
}
function xmlPosted() {
if (req.readyState != 4) return;
if (req.status == 200) {
var result = req.responseXML;
} else {
// fall on our sword
}
}
這個強大的工具應用前景非常廣泛,而且對其潛在應用方面的探索才剛剛開始。但是在任何准備在網上建立XML園地的人失控前,我建議我們先架起一個安全網以防止任何抱負極高的人摔斷他們的脖子。
JavaScript錯誤處理基礎
JavaScript在其早期版本就支持簡單的錯誤處理,但是非常簡陋,只有少數的特性,並且實現的很差。新近的浏覽器不僅支持了類似於C++和Java用於錯誤處理的關鍵字try/catch/finally,而且實現了onerror事件提供捕捉在運行期產生的任何錯誤。其使用方法非常簡單而且直接:
function riskyBusiness() {
try {
riskyOperation1();
riskyOperation2();
} catch (e) {
// e是錯誤類型對象
// 至少有兩個屬性:name及message
} finally {
// 清理工作
}
}
window.onerror = handleError; // 架起捕獲錯誤的安全網
function handleError(message, URI, line) {
// 提示用戶,該頁可能不能正確回應
return true; // 這將終止默認信息
}
一個實例:將客戶端的錯誤傳遞個服務器
現在我們已經了解了XMLHttpRequest和JavaScript錯誤處理的基礎,讓我們通過一個簡單的例子來看一下如何將這兩個聯系在一起使用。你也許會認為JavaScript錯誤應該很容易通過狀態欄的黃色三角認出,但是我仍然在幾個可靠組織的面向公眾的網站上發現他們躲過了質量評估部門。
因此,在這我將提供一種捕捉錯誤並將他們在服務器上記錄,希望能夠提醒某個人去修改這些錯誤。首先,我們考慮客戶端。客戶端需要提供一個產生日志記錄的類,這個類在使用時必須只實例化一次,並能夠透明地處理那些復雜的細節。
我們首先創建構造器:
// 一個類構造方法
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 + '</locatio