一聚教程网:一个值得你收藏的教程网站

最新下载

热门教程

javascript与webservice的通信与介绍

时间:2010-12-27 编辑:简简单单 来源:一聚教程网

webservice它是一种构建应用程序的普遍模型,可以在任何支持网络通信的操作系统中实施运行;它是一种新的web  webservice
应用程序分支,是自包含、自描述、模块 化的应用,可以发布、定位、通过web调用。web service是一个应用组件,它逻辑性的为其他应用程序提供数据与服务.各应用程序通过网络协议和规定的一些标准数据格式(http,xml,soap)来访问web service,通过web service内部执行得到所需结果.web service可以执行从简单的请求到复杂商务处理的任何功能。一旦部署以后,其他web service应用程序可以发现并调用它部署的服务。

using system;
using system.io;
using system.collections;
using system.collections.generic;
using system.componentmodel;
using system.web;
using system.web.services;
using system.web.services.protocols;
using system.drawing;
using system.drawing.imaging;
namespace nightkidsservices
{
///


/// service1 的摘要说明
///

[webservice(namespace = "http://tempuri.org/")]
[webservicebinding(conformsto = wsiprofiles.basicprofile1_1)]
[toolboxitem(false)]
public class testservice :webservice
{
private static int picnum = -1;
[webmethod]
public resource getresource()
{
return resource.createresource("pic2", "asdfasd", 0);
}
[webmethod]
public string helloworld()
{
return "hello";
}
[webmethod]
public byte[] getpic()
{
picnum = (picnum + 1) % 32;
image image = image.fromfile(this.server.mappath("jpeg/" + (picnum+1).tostring() + ".bmp"));
memorystream mem=new memorystream();
image.save(mem, imageformat.jpeg);
return mem.getbuffer();
}
[webmethod]
public list getresourcelist()
{
return new list(new resource[] { resource.createresource("pic1", "jpeg/1.bmp", 0),resource.createresource("pic2", "jepg/2.bmp", 0), resource.createresource("pic3", "jpeg/3.bmp", 0), resource.createresource("pic4", "jepg/4.bmp", 0) });
}
}


以上只是一个简单的测试使用,便于后续使用网页特效处理不同类型的数据
对于javascript,肯定是使用xmlhttprequest对象来访问服务器端的,不过这里为了简单,我没有考虑兼容性问题,直接使用xmlhttprequest对象(我使用chrome浏览器作为测试浏览器),为此我使用ajaxclient类来进行http操作(post 方法),webservice类来封装处理webservice(调用ajaxclient类作为操作类),jsonconverter类处理xml数据转换为json数据
common.js(包含jsonconverter类) 

 
复制代码 代码如下:
//

javascript document
function $(id)
{
return document.getelementbyid(id);
}
function getxmlhttp()
{
if(window.xmlhttprequest)
return new xmlhttprequest();
}
var jsonconverter={};
jsonconverter.flagstack=[];
jsonconverter.convertfromxml=function(xmlrootnode)
{
if(!xmlrootnode)
return;
var converter={};
converter.render=function(node,isarrayelement)
{
var returnstr='';
var isarray=false;
if(node.childnodes.length==1)
{
returnstr+=node.nodename+':' + "'" + node.firstchild.nodevalue + "'" ;
if(node==xmlrootnode)
returnstr='{' + returnstr + '}';
return returnstr;
}
isonenode=false;
if(node.nodename.match("arrayof*"))
isarray=true;
if(isarray)
returnstr+='[';
else
{
returnstr+='{';
if(!(isarrayelement || xmlrootnode==node))
returnstr=node.nodename + ':' + returnstr;
}
for(var i=1;i {
returnstr+=this.render(node.childnodes[i],isarray) + ',';
}
returnstr=returnstr.slice(0,-1);
if(isarray)
returnstr+=']';
else
returnstr+='}';
return returnstr;
}
//alert(converter.render(xmlrootnode));
return eval('(' + converter.render(xmlrootnode) + ')');
}



ajaxclient.js
复制代码 代码如下:
// javascript document
function ajaxclient(url)
{
var xmlhttp=getxmlhttp();
var request_url=url;
var msglist=new array();
var isopen=false;
var isrunning=false;
xmlhttp.onreadystatechange=function()
{
if(xmlhttp.readystate==xmlhttp.done)
{
isrunning=false;
if (xmlhttp.status==200)
{
msglist.push(xmlhttp.responsexml);
}
}
}
this.open=function()
{
if(xmlhttp==null)
xmlhttp=getxmlhttp();
isopen=true;
if(xmlhttp==null)
isopen=false;
}
this.send=function(msg)
{
if (isopen)
{
xmlhttp.open("post",request_url,false);
//alert(request_url);
xmlhttp.setrequestheader("content-type", "application/x-www-form-urlencoded");
xmlhttp.setrequestheader("content-length",msg==null?0:msg.length);
//xmlhttp.setrequestheader("keep-alive","on");
xmlhttp.send(msg==null?"":msg);
isrunning=true;
}
}
this.geturl=function()
{
return request_url.length==0?'':request_url;
}
this.seturl=function(url)
{
request_url=url;
}
this.receive=function()
{
var num=0;
while(!msglist.length)
{
num++;
if (num>=20000)
break;
}
return msglist.length==0?null:msglist.shift();
}
this.close=function()
{
if(!isrunning)
{
isopen=false;
xmlhttp=null;
}
}
}

 
webservice.js
复制代码 代码如下:

// javascript document
function webservice(url)
{
var ajaxclient=new ajaxclient(null);
var requesturl=url;
var responsemsg=null;
this.request=function(requestname,paralist)
{
var url=requesturl +'/' + requestname;
var senddata='';
ajaxclient.seturl(url);
ajaxclient.open();
//alert(ajaxclient.geturl());
if (paralist!=null)
{
for(var obj in paralist)
senddata+=obj.tostring() + '=' + paralist[obj] + '&';
senddata=senddata.slice(0,-1);
}
ajaxclient.send(senddata);
//ajaxclient.close();
//responsemsg=xmltojson(ajaxclient.receive());
//for(var obj in responsemsg)
// alert(obj.tostring() + ':' + responsemsg[obj].tostring());
responsemsg=ajaxclient.receive();
}
this.getresponse=function()
{
return responsemsg;
}
}

调用很简单,只需
复制代码 代码如下:
var webservice=new webservice('http://localhost/nightkidswebservice/request.asmx');
webservice.request("getresourcelist",null);
alert(jsonconverter.convertfromxml(webservice.getresponse().firstchild));

在request方法里面的第一个参数对应不同的服务名称,第二个参数加入对应的服务的参数表(json格式,例如:{id:123,name:'nightkids'})


技术和规则
  在构建和使用web service时,主要用到以下几个关键的技术和规则:   1.xml:描述数据的标准方法.   2.soap:表示信息交换的协议.   3.wsdl:web服务描述语言.   4.uddi(universal description, discovery and integration):通用描述、发现与集成,它是一种独立于平台的,基于xml语言的用于在互联网上描述商务的协议。

实际上,webservice的主要目标是跨平台的可互操作性。为了达到这一目标,webservice完全基于xml(可扩展标记语言)、xsd(xmlschema)等独立于平台、独立于软件供应商的标准,是创建可互操作的、分布式应用程序的新平台。由此可以看出,在以下三种情况下,使用webservice会带来极大的好处。
长项一:跨防火墙的通信
  如果应用程序有成千上万的用户,而且分布在世界各地,那么客户端和服务器之间的通信将是一个棘手的问题。因为客户端和服务器之间通常会有防火墙或者代理服务器。在这种情况下,使用dcom就不是那么简单,通常也不便于把客户端程序发布到数量如此庞大的每一个用户手中。传统的做法是,选择用浏览器作为客户端,写下一大堆asp教程页面,把应用程序的中间层暴露给最终用户。这样做的结果是开发难度大,程序很难维护。   图1通过webservice集成应用程序   举个例子,在应用程序里加入一个新页面,必须先建立好用户界面(web页面),并在这个页面后面,包含相应商业逻辑的中间层组件,还要再建立至少一个asp页面,用来接受用户输入的信息,调用中间层组件,把结果格式化为html形式,最后还要把“结果页”送回浏览器。要是客户端代码不再如此依赖于html表单,客户端的编程就简单多了。   如果中间层组件换成webservice的话,就可以从用户界面直接调用中间层组件,从而省掉建立asp页面的那一步。要调用webservice,可以直接使用microsoftsoaptoolkit或.net这样的soap客户端,也可以使用自己开发的soap客户端,然后把它和应用程序连接起来。不仅缩短了开发周期,还减少了代码复杂度,并能够增强应用程序的可维护性。同时,应用程序也不再需要在每次调用中间层组件时,都跳转到相应的“结果页”。   从经验来看,在一个用户界面和中间层有较多交互的应用程序中,使用webservice这种结构,可以节省花在用户界面编程上20%的开发时间。另外,这样一个由webservice组成的中间层,完全可以在应用程序集成或其它场合下重用。最后,通过webservice把应用程序的逻辑和数据“暴露”出来,还可以让其它平台上的客户重用这些应用程序。

热门栏目