首页>Javascript调用Webservice的多种方法

Javascript调用Webservice的多种方法

作者:xiaosong  日期:06-24
代码如下:
using System; using System.Web; using System.Web.Services; using System.Web.Services.Protocols; [webservice(namespace = "http://tempuri.org/")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] public class Service : System.Web.Services.WebService { public Service () { //uncomment the following line if using designed components //InitializeComponent(); } [webmethod] public string SayHelloTo(string Name) { return "Hello "+Name; } }
2. js调用webservice+xmlhttp的实现部分。
代码如下:
<html> <title>Call webservice with javascript and xmlhttp.</title> <body> <script language="javascript"><!-- //test function with get method. function RequestByGet(data){ var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); //Webservice location. var URL="http://localhost:1323/WebSite6/Service.asmx/SayHelloTo?Name=Zach"; xmlhttp.Open("GET",URL, false); xmlhttp.SetRequestHeader ("Content-Type","text/xml; charset=utf-8"); xmlhttp.SetRequestHeader ("SOAPAction","http://tempuri.org/SayHelloTo"); xmlhttp.Send(data); var result = xmlhttp.status; //OK if(result==200) { document.write(xmlhttp.responseText); } xmlhttp = null; } //test function with post method function RequestByPost(value) { var data; data = '<?xml version="1.0" encoding="utf-8"?>'; datadatadata = data + '<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/">'; datadatadata = data + '<soap:Body>'; datadatadata = data + '<SayHelloTo xmlns="http://tempuri.org/">'; datadatadata = data + '<Name>'+value+'</Name>'; datadatadata = data + '</SayHelloTo>'; datadatadata = data + '</soap:Body>'; datadatadata = data + '</soap:Envelope>'; var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); var URL="http://localhost:1323/WebSite6/Service.asmx"; xmlhttp.Open("POST",URL, false); xmlhttp.SetRequestHeader ("Content-Type","text/xml; charset=gb2312"); xmlhttp.SetRequestHeader ("SOAPAction","http://tempuri.org/SayHelloTo"); xmlhttp.Send(data); document.write( xmlhttp.responseText); } // --></script> <input type="button" value="CallWebserviceByGet" onClick="RequestByGet(null)"> <input type="button" value="CallWebserviceByPost" onClick="RequestByPost('Zach')"> </body> </html>
对于使用post方法需要发送的那堆东东可以在webservice的测试页面中找到,自己拼凑加上对应的参数就可以。
通过style.behavior来实现的方法(比较简单)
function getfemale()
{
//第一个参数是webservice的url,后面是名称
female.useService("news.asmx?WSDL","news");
//设置一个回调函数,service返回结果的时候回调;第一个参数是回调函数的名称,后面的是webservice的参数
intCallID=female.news.callService(female_result,"getphoto","female"); //这里有两个参数.....
}
function female_result(result)//回调函数
{
if(result.error)
{
female.innerHTML=result.errorDetail.string;
}
else
{
female.innerHTML=result.value; //将webservice返回的结果写如div中
}
}
页面显示部分:

ok,这给我们在静态页调用动态的内容提供了一种途径;
这里如果给getfemale()函数加上定时调用的话,就是一种无刷新更新页面的机制了。
缺点是webservice会有一定的延迟,即使是本地的webservice也会比静态页面慢很多,初次打开页面会感觉很不协调。
第二种方法使用了style.代码就简洁多了他使用了css.定义了div的行为.比起第一种方法,就易读多了:)
style="behavior:url(webservice.htc)"
前提条件是:
if you are using Microsoft IE 5 or later, you can use the behavior/HTML-Component "WebService" to access a Web service. The "WebService" behavior communicates with Web services over HTTP using Simple Object Access Protocol (SOAP).
web前端|正则|JSP教程|ASP教程|
ajax教程|jquery教程|css教程|服务器|
操作系统|linux系统|SEO优化|网站运维|
织梦cms|javascript教程|html教程|编程开发|
php开发|数据库|Mysql教程|CMS建站教程|
phpcms教程|wordpress|apache服务器|
代码学堂-导航