AJAX技術調用Web服務的實現

摘要:該文實現了AJAX技術對Web Services的調用，改善了由于AJAX技術大量的Web應用所產生的服務器端對事務管理混亂的問題。解決了以服務為中心B/S與C/S相結合的網絡應用系統開發模式的核心問題。

關鍵詞:AJAX;Javascript;Web Services

中圖分類號:TP311文獻標識碼:A文章編號:1009-3044(2009)25-7137-02

Impletition of AJAX technology in Web Services

CHEN Yang， LIU Yun-peng

(Jiaozuo University， Jiaozuo 454003， China)

Abstract: In this paper， using AJAX technology in web services is realized. The trouble of worse transaction management on server resulted from using much AJAX technology has gotten much improved. The key problem of Network application development model is solved， which is based on combination of B/S and C/S.

Key words: AJAX; Javascript; Web Services

隨著AJAX(Asynchronous Javascript And XML)技術不斷的成熟，我們見到了越來越多的富Web應用(Rich Web Application)出現。例如，近兩年基于網頁的網絡游戲。AJAX技術的廣泛應用，不但極大的改善了網頁的用戶體驗，而且豐富了網頁的應用[1]。

但是，當我們打開一個使用AJAX技術的網頁后，AJAX引擎在后臺開始運行，對服務器產生的請求也由網頁請求轉變為事務請求，服務器的網頁管理功能也轉變為事務管理功能。這樣以網頁文件的形式對事務進行管理，就顯得非常不合適。

我們可以通過Web Services對AJAX引擎請求的事務進行管理，以改善服務器端對事務管理混亂的問題。

1 AJAX技術調用Web Services的分析與設計

我們知道，瀏覽器發出的請求是基于Http協議的。Web Services與客戶端程序進行交互所使用的是SOAP協議，而SOAP協議工作在Http協議之上。XMLHttpRequest對象可以發出Http請求。這也就是說，通過Javascript控制XMLHttpRequest對象產生SOAP消息來調用Web Services是可行的[2]。

由SOAP請求格式我們可知，它與Http請求格式是基本一致的，但我們仍需要通過程序來設定一些內容。在SOAP消息頭里需要通過程序設定Content-Type和SOAPAction。Content-Type的值是“text/xml; charset=utf-8”。SOAPAction是所調用的Web Services的Namespace字符串拼接“/” 再拼接所調用的Web Services的方法名字符串。其中Namespace字符串可以從該Web Services的WSDL文檔中獲得。在SOAP消息體中，我們需要設定所調用的方法名、xmlns值和所調用的方法所需的參數。方法名在是我們已知的，xmlns值就是Web Services的Namespace字符串。至于參數，我們可以以“<參數名>參數值”這種格式將其轉變成XML文檔片段即可[3]。

這樣，我們可知，調用Web Services，只需要提前知道它的URL地址，所調用的方法名，所調用的方法的參數。這也符合客戶端與服務器端低耦合的要求。

從Web Services的WSDL文檔中，我們不但可以獲得發送SOAP消息所需要的Namespace，還可以獲得參數和返回值的數據類型，這樣我們就可以將獲得的返回數據轉換成相應的數據類型。參數我們可以轉換成XML文檔片段，需要將相應的數據類型轉換成字符串型數據。

因此，要在發送SOAP消息前，我們必須先獲得該Web Services的WSDL文檔。通過程序從獲得的WSDL文檔中提取所需要的Namespace。然后將WSDL文檔和Namespace緩存起來。接著通過程序組成SOAP消息再使用XMLHttpRequest對象發送。將返回的數據通過程序提取結果，并按照WSDL文檔中返回值的數據類型進行相應的數據類型轉換即可。如果再次調用該Web Services中的任一方法，可以直接使用即可。因為已經緩存有該Web Services的WSDL文檔和Namespace，所以不必再從服務器獲取該Web Services的WSDL文檔。調用WSDL文檔只需要Http協議即可。其工作原理如圖1所示。

綜上所述，Javascript調用Web Services的整個處理過程如圖2所示。

2 AJAX技術調用Web Services的核心算法

在整個實現過程中，核心處理步驟有三處，分別是:調用WSDL、組成并發送SOAP請求、獲取并解析返回數據。在這里，我們給出相應的算法。

調用WSDL的算法如下:

SOAP.prototype.getWSDLFromServer = function(){

var obj = this

xmlHttp = this.getXmlHttp()//創建XMLHttpRequest對象

xmlHttp.open(\"GET\"， this.url + \"?wsdl\"， 1)//打開WSDL，同步調用

xmlHttp.onreadystatechange = function(){

if(xmlHttp.readyState == 4){

if(xmlHttp.status == 200){

obj.wsdlToNameSpace(xmlHttp)//從獲取的WSDL中提取NameSpace

}else{

obj.getErrMsg(xmlHttp)

}

}

}

xmlHttp.send(1);

}

產生SOAP請求的算法如下

SOAP.prototype.send = function(){

//創建SOAP請求格式的字符串

var obj = this

var sr =

\"\" +

\"

\"xmlns:xsi=\\\"http://www.w3.org/2001/XMLSchema-instance\\\" \" +

\"xmlns:xsd=\\\"http://www.w3.org/2001/XMLSchema\\\" \" +

\"xmlns:soap=\\\"http://schemas.xmlsoap.org/soap/envelope/\\\">\" +

\"\" +

\"<\" + this.method + \" xmlns=\\\"\" + this.ns + \"\\\">\" +

this.parameters +

\"

var xmlHttp = this.getXmlHttp();//創建XMLHttpRequest對象

xmlHttp.open(\"POST\"， this.url， true);//打開WSDL，異步調用

var soapaction = ((this.ns.lastIndexOf(\"/\") != this.ns.length - 1) ? this.ns + \"/\" : this.ns) + this.method;

xmlHttp.setRequestHeader(\"SOAPAction\"， soapaction); //設置SOAPAction

xmlHttp.setRequestHeader(\"Content-Type\"， \"text/xml; charset=utf-8\");//設置Content-Type

xmlHttp.onreadystatechange = function(){

if(xmlHttp.readyState == 4){

if(xmlHttp.status == 200){

obj.getResult(xmlHttp);//從返回的數據中提取結果

}else{

obj.getErrMsg(xmlHttp)

}

}

}

xmlHttp.send(sr);

}

獲取并解析返回數據的算法如下:

SOAP.prototype.getResult = function(xmlHttp){

var nd， o

nd = xmlHttp.responseXML.getElementsByTagName(this.method + \"Result\")

o = this.resultToObj(nd[0])//將結果按照WSDL的要求進行數據轉換

this.onCompleted(o， xmlHttp)

}

在這里，將結果按照WSDL的要求進行數據轉換處理過程十分復雜，代碼量占到了整個實現代碼的一半左右。主要是因為在進行數據類型轉換時，需要考慮到同一類型數據數據在服務器與客戶端表示方法不一樣，例如時間日期型與數組。當然，如果想自行處理數據類型，可以省去這一步。

當Web Services返回出錯信息時，解析算法如下:

SOAP.prototype.getErrMsg = function(xmlHttp){

var o = \"\"

o = o + \"錯誤代碼:\" + xmlHttp.status +\"\\"

o = o + xmlHttp.responseXML.getElementsByTagName(\"faultstring\")[0].childNodes[0].nodeValue

this.onError(o)

}

如果我們要對返回數據進行進一步處理時，可以講onCompleted、onError事件進行編程重載。

3 結束語

本文實現了AJAX技術對Web Services的調用，改善了由于AJAX技術大量的Web應用所產生的服務器端對事務管理混亂的問題。解決了以服務為中心B/S與C/S相結合的網絡應用系統開發模式的核心問題。

參考文獻:

[1] Garrett J J.Ajax: A New Approach to Web Applications[EB/OL].http://www.adaptivepath.com/ideas/essays/archives/000385.php.

[2] 喻堅，韓燕波.面向服務的計算——原理和應用[M].北京:清華大學出版社，2006.

[3] 陳陽，朱毅彬.一種以服務為中心的網絡應用系統開發模式的研究與設計[J].科技信息，2009(9).