現在REST是一個比較熱門的概念，REST已經成為一個在Web上越來越常用的應用，基于REST的Web服務越來越多，包括Twitter在內的微博客都是用REST做為對外的API，先前我曾經介紹過“基于REST架構的Web Service設計”，并給出了一些服務器端和客戶端代碼，隨著JavaScript的廣泛應用，我這里就給出一個輕量級的基于JavaScript的REST客戶端框架。

這個JavaScript客戶端主要使用了XMLHttpRequest對象來實現通過HTTP對服務器操作GET、PUT、POST和DELETE以檢索和修改資源。值得注意的是，由于安全方面的考慮，Javascript被限制了跨域訪問的能力，因此在調用XMLHttpRequest的時候，應該注意跨域訪問的問題，比如使用同一個域的動態文件做代理，或者其他方法避開跨域訪問的問題。我這里給出的代碼主要是根據我先前的那段代碼修改過來的，其客戶端JavaScript代碼如下所示：

function httpGet(url, method, data) {  
    var xmlhttp;  
    xmlhttp = new XMLHttpRequest();  
    xmlhttp.open (method, url + "?" + data, false);  
    xmlhttp.setRequestHeader ("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");  
    xmlhttp.setRequestHeader ("Content-Length", data.length);  
    xmlhttp.send (null);  
    if (xmlhttp.Status = 200) return xmlhttp.responseText;  
}  
 
function httpPost(url, method, data) {  
    var xmlhttp;  
    xmlhttp = new XMLHttpRequest();  
    xmlhttp.open (method, url, false);  
    xmlhttp.setRequestHeader ("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");  
    xmlhttp.setRequestHeader ("Content-Length", data.length);  
    xmlhttp.send (data);  
    if (xmlhttp.Status = 200) return xmlhttp.responseText;  
}  
 
function httpPut(url, method, data) {  
    var xmlhttp;  
    xmlhttp = new XMLHttpRequest();  
    xmlhttp.open (method, url, false);  
    xmlhttp.setRequestHeader ("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");  
    xmlhttp.setRequestHeader ("Content-Length", data.length);  
    xmlhttp.send (data);  
    if (xmlhttp.Status = 200) return xmlhttp.responseText;  
}  
 
function httpDelete(url, method, data) {  
    var xmlhttp;  
    xmlhttp = new XMLHttpRequest();  
    xmlhttp.open (method, url + "?" + data, false);  
    xmlhttp.setRequestHeader ("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");  
    xmlhttp.setRequestHeader ("Content-Length", data.length);  
    xmlhttp.send (null);  
    if (xmlhttp.Status = 200) return xmlhttp.responseText;  
}  
 
function test() {  
    document.write (httpGet("http://localhost/rest/service.asp", "GET", "do=GET"));  
    document.write (httpGet("http://localhost/rest/service.asp", "POST", "do=POST"));  
    document.write (httpGet("http://localhost/rest/service.asp", "PUT", "do=PUT"));  
    document.write (httpGet("http://localhost/rest/service.asp", "DELETE", "do=DELETE"));  
}  

我這里使用這個代碼編寫了一個簡單的應用例子，就是管理Twitter好友的應用，大家點這里可以下載使用，因為跨域訪問的問題，這段JavaScript只支持IE在本地使用。

【編輯推薦】

1. 如何優化JavaScript腳本的性能
2. JavaScript控制Excel打印完美解決方案
3. 用Javascript連接Access數據庫的方法
4. JavaScript的document和window對象詳解
5. 淺談JavaScript中面向對象技術的模擬