JavaScript調用Web Service

一、經過Webservice.htc調用WebServicejavascript

(1)使用webservice.htc的限制:
1>要想使用webservice行爲組件訪問webservice必須保證包含組件的頁面和webservice在相同html

的域中,對於遠程服務能夠創建本地的中轉代理webservice實現。
2>webservice行爲組件支持.net中的基本數據類型及其數組,可是用於DataSet自定義類等不提java

供直接支持,若是使用能夠作相應的轉化。
3>保證瀏覽器是IE5.0或者以上版本。
(2)使用步驟
1>先從微軟網站上下載webservice.htc,
2>把webservice行爲組件幫定到一個html元素。
3>用webservice行爲組件的useService提供webservice的地址。
4>用webservice行爲組件的callService訪問webmethod。node

(3)主要用到了其中的兩個方法
一、service.useService({webservice地址},{本地的webservice代理類名})
二、service.{本地的webservice代理類名}.callService({本地的回調函數},{要調用的webservice方法名},{須要爲方法傳遞的參數})
callService方法中的第一個參數爲本地的回調函數,經過此函數能夠對調用webservice返回的結果做相應的處理web

(4)代碼示例以下:c#

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Js 調用 WebService實例</title>
<script language="JavaScript">
function init()
{
//改爲你本身的實際地址
divservice.useService("http://localhost:12074/Service1.asmx?WSDL","S");
//       //調用示例
//        var iCallID;
//        var intA = 2;
//        var intB = 3;
//       iCallID = service.S.callService("Add", intA, intB);
}
function onWSresult()
{
if((event.result.error)&&(iCallID==event.result.id))// 若是有錯誤
{
//獲得詳細錯誤信息
var xfaultcode   = event.result.errorDetail.code;
var xfaultstring = event.result.errorDetail.string;
var xfaultsoap   = event.result.errorDetail.raw;
// 錯誤處理代碼
}
else
if((!event.result.error) && (iCallID == event.result.id))
{
divservice.innerHTML=  event.result.value;// 顯示計算結果
}
else
{
alert("Something else fired the event!");
}
}
</script>
</head>
<body  type='text' id='ip1' name="ip1"><br>
第二個值:<input type='text' id='ip2' name="ip2"><br>
<button onclick='iCallID=divservice.S.callService("Add",ip1.value,ip2.value);'
id="Button1" type="button">s調用加法方法</button><br>
返回結果:<div id="divservice" style=" url(webservice.htc)"  onresult="onWSresult()">
</div>
</div>
</body>
</html>

二、經過Microsoft.XMLDOM調用WebService數組

代碼示例以下:瀏覽器

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>經過Microsoft.XMLDOM調用WebService</title>
<script language="javascript" type="text/javascript">
function getXMLData()
{
docSubmit =new ActiveXObject("Microsoft.XMLDOM");
docSubmit.async = false;
//WebService引用地址
docSubmit.load("http://localhost:12074/Service1.asmx/GetProducts?topNum=5");
docSubmit.loadXML(docSubmit.xml.replace(/&lt;/g,"<").replace(/&gt;/g,">"));
var s="";
nodeList=docSubmit.documentElement.getElementsByTagName("ds");
for (i=0;i<nodeList.length;i++)
{
s=s+nodeList(i).selectSingleNode("Name").text+'<br>';//顯示產品名稱
}
div2.innerHTML=s;
}
function getStringData() {
docSubmit = new ActiveXObject("Microsoft.XMLDOM");
docSubmit.async = false;
docSubmit.load("http://localhost:12074/Service1.asmx/GetProductPrice?ProductId=001");
var s = docSubmit.documentElement.text; //獲取返回結果
div1.innerHTML = s;
}
</script>
</head>
<body>
<input type="button" value="調用返回字符串的方法"  type="button" value="調用返回XML數據集的方法"  id="div1" class="list"></span>
<br/>
<span id="div2" class="list"></span>
</body>
</html>

三、經過Microsoft.XMLHTTP調用WebServiceapp

代碼示例以下:async

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>經過XMLHTTP-POST調用WebService</title>
<script language="JavaScript" type="text/javascript">
function GetDataByXMLHttpPost(i) {
//WebService引用地址
var URL = "http://localhost:12074/Service1.asmx/GetProductPrice";
var Params = "ProductId=" + i;// Set postback parameters
var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
xmlhttp.Open("POST",URL, false);
xmlhttp.SetRequestHeader ("Content-Type","application/x-www-form-urlencoded");
xmlhttp.SetRequestHeader ("Content-Length",Params.length);
xmlhttp.send(Params);
var x =   xmlhttp.responseXML;
div1.innerHTML=x.childNodes[1].text;
//返回調用狀態,狀態爲200說明調用成功,500則說明出錯
alert(xmlhttp.Status);
alert(xmlhttp.StatusText);
}
</script>
</head>
<body>
<input type="button" value="XMLHttpPost"  id="Button2" name="Button2"/>
<br/>
<div id="div1"></div>
</body>
</html>

四、經過SOAP調用WebService

代碼示例以下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>經過SOAP調用WebService</title>
<script language="JavaScript" type="text/javascript">
function GetDataBySoap(i)
{
var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
var soapMessage, soapData, URL;
// 設置SOAP信息
soapMessage = "<?xml version=\"1.0\" encoding=\"utf-8\"?>";
soapMessage += "<soap:Envelope 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/\">";
soapMessage += "<soap:Body>";
// 設置SOAP數據 ---- begin ------
soapData = "<GetProductPrice xmlns=\"http://tempuri.org/\">";
soapData += "    <ProductId>" + i + "</ProductId>";
soapData += "</GetProductPrice>";
// 設置SOAP數據 ----  end  ------
soapMessage = soapMessage + soapData + "</soap:Body>";
soapMessage = soapMessage + "</soap:Envelope>";
URL = "http://localhost:12074/Service1.asmx"; //能夠使用相對地址或完整URL
xmlhttp.Open("POST",URL, false);
xmlhttp.SetRequestHeader ("Content-Type","text/xml; charset=utf-8");
xmlhttp.SetRequestHeader ("SOAPAction","http://tempuri.org/GetProductPrice");//方法名
xmlhttp.send(soapMessage);
alert(soapMessage)//SOAP數據信息
var x = xmlhttp.responseXML;
alert('調用結果:'+x.childNodes[1].text);
//返回調用狀態,狀態爲200說明調用成功,500則說明出錯
alert('狀態值:'+xmlhttp.Status);
alert('狀態描述:'+xmlhttp.StatusText);
}
</script>
</head>
<body>
<input type="button" value="SOAP"  id="Button1" name="Button1" />
<br/>
<div id="div1"></div>
</body>
</html>
相關文章
相關標籤/搜索