摘要：
WebService既可以大用，也可以小用。今天我们就来看一下如何在网页中用JS来调用WebService。我们举的例子很简单，用JS调用默认VS2008生成的HelloWorld服务。Service的代码如下：usingSystem;usingSystem.Collections;usingSystem.ComponentModel;usingSystem.Data;usingSystem.Linq;usingSystem.Web;usingSystem.Web.Services;usingSystem.Web.Services.Protocols;usingSystem.Xml.Linq;namespaceBlogNet.WebService{[WebService][WebServiceBinding][ToolboxItem]//ToallowthisWebServicetobecalledfromscript,usingASP.NETAJAX,uncommentthefollowingline.//[System.Web.Script.Services.ScriptService]publicclassOpService:System.Web.Services.WebService{[WebMethod]publicstringHelloWorld(){return"HelloWorld";}}}关键部分是JS的代码，首先，我们需要下载一个webservice.htc,这个是IE中支持支持JS调用WebService的组件，我们可以在微软网站下载到。然后，在HTML中，使用CSS的behavior特性来调用该组件，如下：我们还需要把webservice返回的结果放在div的onresult事件里，如下：需要注意的是：url连接必须跟上?wsdl"完整代码如下：˂!
WebService既可以大用，也可以小用。
大用可以应用到整个系统，将整个系统设计成SOA(面向服务)，小用可以应用到JS。
今天我们就来看一下如何在网页中用JS来调用WebService。
我们举的例子很简单，用 JS调用默认VS2008生成的Hello World服务。
Service的代码如下：
大用可以应用到整个系统，将整个系统设计成SOA(面向服务)，小用可以应用到JS。
今天我们就来看一下如何在网页中用JS来调用WebService。
我们举的例子很简单，用 JS调用默认VS2008生成的Hello World服务。
Service的代码如下：
usingSystem;
usingSystem.Collections;
usingSystem.ComponentModel;
usingSystem.Data;
usingSystem.Linq;
usingSystem.Web;
usingSystem.Web.Services;
usingSystem.Web.Services.Protocols;
usingSystem.Xml.Linq;
namespaceBlogNet.WebService
{
[WebService(Namespace="http://www.cnblogs.com/davidgu/opservice")]
[WebServiceBinding(ConformsTo=WsiProfiles.BasicProfile1_1)]
[ToolboxItem(false)]
//ToallowthisWebServicetobecalledfromscript,usingASP.NETAJAX,uncommentthefollowingline.
//[System.Web.Script.Services.ScriptService]publicclassOpService:System.Web.Services.WebService
{
[WebMethod]
publicstringHelloWorld()
{
return"HelloWorld";
}
}
}
usingSystem.Collections;
usingSystem.ComponentModel;
usingSystem.Data;
usingSystem.Linq;
usingSystem.Web;
usingSystem.Web.Services;
usingSystem.Web.Services.Protocols;
usingSystem.Xml.Linq;
namespaceBlogNet.WebService
{
[WebService(Namespace="http://www.cnblogs.com/davidgu/opservice")]
[WebServiceBinding(ConformsTo=WsiProfiles.BasicProfile1_1)]
[ToolboxItem(false)]
//ToallowthisWebServicetobecalledfromscript,usingASP.NETAJAX,uncommentthefollowingline.
//[System.Web.Script.Services.ScriptService]publicclassOpService:System.Web.Services.WebService
{
[WebMethod]
publicstringHelloWorld()
{
return"HelloWorld";
}
}
}
关键部分是JS的代码，首先，我们需要下载一个 webservice.htc,
这个是IE中支持支持JS调用WebService的组件，我们可以在微软网站下载到。
我们将这个文件放在我们网页的同一个目录。
然后，在HTML中，使用CSS的 behavior特性来调用该组件，如下：
<div ...>
我们还需要把web service返回的结果放在div的onresult事件里，如下：
<div onresult="onWebServiceResult()"></div>
需要注意的是：
url连接必须跟上?wsdl后缀，否则会报错。
"http://localhost:1408/WebService/OpService.asmx?wsdl"
完整代码如下：
<%@PageLanguage="C#"AutoEventWireup="true"CodeBehind="testJsCustomer.aspx.cs"Inherits="BlogNet.WebService.testJsCustomer"%><!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><headrunat="server"><title>javascript调用WebService</title><scripttype="text/javascript">variCallID=null;
varsUrl="http://localhost:1408/WebService/OpService.asmx?wsdl";
functiongetHelloWorld(){
varoService=document.getElementById("service");
oService.useService(sUrl,"WS_OpService");
iCallID=service.WS_OpService.callService("HelloWorld");
}
/*
functioncallback(res){
//varoResult=event.result;
if(!res.error){
alert("webservicesuccess!");
}else{
alert("webserviceerror!");
}
}
*/functiononWebServiceResult(){
varoResult=window.event.result;
if(oResult.id==iCallID){
varoDiv=document.getElementById("Result");
if(oResult.error){
alert("Anerroroccurred:"+oResult.errorDetail.string);
}else{
alert("Theresultis:"+oResult.value);
}
}
}
</script></head><body><formid="form1"runat="server"><div><divid="service"style="behavior:url(webservice.htc)"onresult="onWebServiceResult()"></div><inputtype="button"id="btnLoad"name="btnLoad"value="loadresult"
onclick="javascript:getHelloWorld();"/><divid="Result"></div></div></form></body></html>
varsUrl="http://localhost:1408/WebService/OpService.asmx?wsdl";
functiongetHelloWorld(){
varoService=document.getElementById("service");
oService.useService(sUrl,"WS_OpService");
iCallID=service.WS_OpService.callService("HelloWorld");
}
/*
functioncallback(res){
//varoResult=event.result;
if(!res.error){
alert("webservicesuccess!");
}else{
alert("webserviceerror!");
}
}
*/functiononWebServiceResult(){
varoResult=window.event.result;
if(oResult.id==iCallID){
varoDiv=document.getElementById("Result");
if(oResult.error){
alert("Anerroroccurred:"+oResult.errorDetail.string);
}else{
alert("Theresultis:"+oResult.value);
}
}
}
</script></head><body><formid="form1"runat="server"><div><divid="service"style="behavior:url(webservice.htc)"onresult="onWebServiceResult()"></div><inputtype="button"id="btnLoad"name="btnLoad"value="loadresult"
onclick="javascript:getHelloWorld();"/><divid="Result"></div></div></form></body></html>
运行结果：
alert框弹出 "Hello World"