Ajax与WebService通讯(转载)
2010-03-31 12:32 爱研究源码的javaer 阅读(340) 评论(0) 编辑 收藏 举报[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
public class Service : System.Web.Services.WebService
{
public Service () {
}
[WebMethod]
public string HelloWorld() {
return "Hello World";
}
[WebMethod]
public int AddNum(int a, int b)
{
return a + b;
}
}
WebService很简单,都能看懂,现在看怎么在前台利用JAVASCRIPT调用这些方法,就举例调用AddNum方法吧,首先我写一个JS,如下:
var xmlhttp=false;
var objXmlDoc;
function getHTTPRequestObject()
{
try
{
xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e)
{
try
{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e)
{
xmlhttp=false;
}
}
if(!xmlhttp && typeof XMLHttpRequest!='undefined')
{
xmlhttp=new XMLHttpRequest();
}
}
function GetProductValue(url,action,strMain,callback)
{
getHTTPRequestObject();
var strEnvelope="<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/\">\n"+
" <soap:Body>\n"+
strMain+
" </soap:Body>"+"</soap:Envelope>";
xmlhttp.open("POST",url,true);
xmlhttp.onreadystatechange=function(){
if(xmlhttp.readyState==4)
{
if(xmlhttp.status==200)
{
objXmlDoc=new ActiveXObject("Msxml2.DOMDocument");
var serviceResponse=xmlhttp.responseText;
objXmlDoc.loadXML(serviceResponse);
if(objXmlDoc.parseError.errorCode!=0)
{
var xmlErr=objXmlDoc.parseError;
alert("oops:"+xmlErr.reason);
}
else
{
callback(objXmlDoc);
}
}
else
{
alert(xmlhttp.statusText);
}
}
};
xmlhttp.setRequestHeader("Content-Type","text/xml");
xmlhttp.setRequestHeader("SOAPAction",action);
xmlhttp.send(strEnvelope);
}
//有必要解释下,GetProductValue(url,action,strMain,callback)这个方法的几个参数的作用,
URL,就是WebService的URL,这里是"http://localhost:1034/WebSerive1/Service.asmx",
ACTION,就是你要调用哪个方法,这里是"http://tempuri.org/AddNum",http://tempuri.org是名字空间,在写WebService时在开头已经声明,
strMain,是SOAP信封包的主体,具体见实例代码,
callback,用过AJAX的朋友都知道,就是在结果返回后的响应函数。
好,看我如何调用吧,
HTML代码:
<input id="Button1" type="button" value="button" onclick="getValue()" />
JAVASCRIPT代码:
function getValue()
{
var url="http://localhost:1034/WebSerive1/Service.asmx";
var action="http://tempuri.org/AddNum";
var strMain="<AddNum xmlns=\"http://tempuri.org/\"><a>1</a><b>2</b></AddNum>";
GetProductValue(url,action,strMain,function(result){
var items=result.getElementsByTagName("AddNumResult");
alert(items[0].firstChild.nodeValue);
});
}
//我要调用AddNum方法,参数是1和2,返回结果是个XML文挡,看截图,
所以要进行相关处理才能得到我们想要的值。
结果如图:
转自 :http://hi.baidu.com/intercessor/blog/item/05358e582f9db488800a1880.html