月光博客 » 编程开发 » 基于JavaScript的REST客户端框架

基于JavaScript的REST客户端框架

  现在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在本地使用。

基于JavaScript的REST客户端框架

顶一下 ▲()   踩一下 ▼()

相关文章

  1. 1
    园子   说道:
    太专业了

    对JavaScript还不是很懂

    得慢慢学~
    支持(9反对(2回复
  1. 2
    grnnet   说道:
    太高深了, 我不懂啊,慢慢学吧
    支持(9反对(4回复
  1. 3
    和平国旅   说道:
    REST这个对于我来说是新玩意呀,看来要多学习才行,要不就淘汰了。
    支持(9反对(4回复
  1. 4
    visvoy   说道:
    冗余太高,需要封装
    支持(8反对(3回复
  1. 5
    可能有错   说道:
    这种代码着实谈不上专业
    支持(8反对(4回复
  1. 6
    su27   说道:
    为了兼容IE,应为IE生成new ActiveXObject("Microsoft.XMLHTTP")来替代标准的XMLHttpRequest()
    williamlong 于 2009-6-14 21:35:52 回复
    IE7和IE8都支持XMLHttpRequest的。
    支持(9反对(5回复
  1. 7
    romotc   说道:
    httpPost, httpGet, httpPut, httpDelete这四个方法设计的是否有些冗余了,test()方法是不是写错了一些东西?还是我没有领会您的意思?
    支持(7反对(3回复
  1. 8
    imonv   说道:
    沙发,专业的慢慢看
    支持(9反对(6回复
  1. 9
    dotion   说道:
    我来早了 :)

    真不错, 技术类的文章基本不看, 因为看不懂 :(
    支持(5反对(3回复
  1. 10
    2547   说道:
    技术类的文章看不懂
    支持(11反对(9回复

发表留言