51Testing软件测试论坛

标题: Web Service 接口 [打印本页]

作者: 小文0111 时间: 2018-4-25 15:33
标题: Web Service 接口
1. Web Service 接口
1.1 接口方式说明和优点
在笔者的开发生涯中，当作为接口提供商给第三方提供接口时，以及作为客户端去调用第三方提供的接口
时，大部分时候都是使用 Web  Service接口， Web Service作为接口使用广泛的原因，与它的特点息息相关。

Web Service的主要目标是跨平台的可互操作性，为了实现这一目标， Web Service 完全基于 XML（可扩
展标记语言）、 XSD（ XML Schema）等独立于平台、独立于软件供应商的标准，是创建可互操作的、分
布式应用程序的新平台。因此使用 Web Service有许多优点：

1.1.1 跨防火墙的通信

如果应用程序有成千上万的用户，而且分布在世界各地，那么客户端和服务器之间的通信将是一个棘手的
问题。因为客户端和服务器之间通常会有防火墙或者代理服务器。要调用 Web Service，可以直接使用 SO
AP客户端，然后把它和应用程序连接起来。不仅缩短了开发周期，还减少了代码复杂度，并能够增强应用
程序的可维护性。
1.1.2 跨程序语言的应用程序集成

在企业的各种应用系统中，很多系统不是使用相同的语言编写的，例如有的使用 Java，有的使用 php、
C#、asp。当各种系统之间需要交互时，可使用各种语言都通用的 WSDL定义接口，对外将需要的接口暴
露给指定的客户。

XML Web services 提供了在松耦合环境中使用标准协议（ HTTP、 XML、 SOAP 和 WSDL）交换消息的能
力。消息可以是结构化的、带类型的，也可以是松散定义的。
   1.1.3 软件和数据重用

Web Service在允许重用代码的同时，可以重用代码背后的数据。使用 Web Service，再也不必像以前那样
，要先从第三方购买、安装软件组件，再从应用程序中调用这些组件；只需要直接调用远端的 Web Serv
ice就可以了。

另一种软件重用的情况是，把好几个应用程序的功能集成起来，通过 Web Service “暴露 ”出来，就可以
非常容易地把所有这些功能都集成到你的门户站点中，为用户提供一个统一的、友好的界面。

可以在应用程序中使用第三方的 Web Service 提供的功能，也可以把自己的应用程序功能通过 Web Ser
vice提供给别人。两种情况下，都可以重用代码和代码背后的数据。

1.2 重要概念
1.2.1 何为Web Service ？
      Web Service是构建互联网分布式系统的基本部件，它是一个应用程序，它向外界暴露出一个能够
通过Web 进行调用的 API 。这就是说，别人能够用编程的方法通过 Web 来调用这个应用程序。

它通过标准通信协议，在互联网上以服务的方式发布有用的程序模块，目前大部分是用 SOAP作为通信协议。

它提供一份详细的接口说明书，来帮助用户构建应用程序，这个接口说明书叫 WSDL（ Web服务描述语
言，Web Service Description Language）。

通常已发布的 Web Service要注册到管理服务器，便于使用者查询和使用。这个是通过 UDDI（统一描述、
发现和集成， Universal Discovery Description and Integration）来完成的。
   1.2.2 何为 SOAP 协议？

SOAP定义 SOAP消息的 XML格式（ XML格式），如果你用一对 SOAP标记（ SOAP Elements）把 XML文
档括起来，那么这个就是一个 SOAP消息。

SOAP规范还定义了怎样用 XML来描述程序数据，怎样执行 RPC（远程过程调用， Remote Procedure Ca
ll）。大多数 SOAP解决方案都支持 RPC-style应用程序，因为很多程序员已对 DCOM或 CORBA熟悉。它
还支持 Document-style应用程序（ SOAP消息只包含 XML文本信息）。 Document-style应用程序有很好
的灵活性，所以很多用 RPC很难构建的 Web Service用这种方式构建。

最后 SOAP规范还定义了 HTTP消息是怎样传输 SOAP消息的。这并不代表 SOAP只能用 HTTP来作为传输
协议， MSMQ、 SMTP、 TCP/IP都可以做 SOAP的传输协议。

安全性对于应用程序来说是很重要的。那么 SOAP的安全性如何呢？对于把 HTTP作为传输协议的 SOAP
来说是没有问题的，因为 HTTP协议已经有很好的安全构架。那么用其他传输协议会出现安全问题吗？
这方面也已经有相关规范

（ http://msdn.microsoft.com/librar ... tml/ws-security.asp ）。
   1.2.3 何为 WSDL ？

WSDL是一种 XML文档，它定义 SOAP消息和这些消息是怎样交换的。 IDL（ Interface Description Lang
uage，接口描述语言）是用于 COM和 CORBA的， WSDL是用于 SOAP的。 WSDL是一种 XML文档，所以
可以阅读和编辑，但很多时候是用工具来创建、由程序阅读。

举个实例，当读者需要使用第三方的 Web Service构建应用程序。你可以向接口提供商索取使用 WSDL文
档，在该文档中详细的说明了各个方法的方法名、参数和参数类型等信息。在 Java等编程语言的 IDE（
例如 My Eclipse）中，可以根据 Web Servie生成对应的测试代码，稍微修改一下即可。
1.2.4 何为 UDDI ？

UDDI可以比喻成电话本，电话本里记录的是电话信息，而 UDDI记录的是 Web Service信息。可以不把W
eb Service注册到 UDDI。但如果要让全球的人知道这个 Web Service，最好还是注册到 UDDI。

UDDI目录说明文件也是一个 XML文档，它包括三个部分。“白页（ White Paper）”说明提供 Web Servi
ce的公司（人）信息，比如说名称、地址和联系方式等等。“黄页（ Yellow Paper）”说明 UDDI目录的分
类，比如说金融、服务和印刷等等。“绿页（ green Paper）”说明接口（ Web Service 提供的）的详细信
息。 UDDI提供多种查询方式，来帮助你找到需要的 Web Service。如果你查询与财务有关的 Web Servi
ce，那么UDDI会提供详细的信息。
1 .2.5 何为 XML ？

XML（ Extensible Markup Language）即可扩展标记语言，它与 HTML一样，都是 SGML(Standard Genera
lized Markup Language,标准通用标记语言 )。在 Web Service接口中， WSDL和 UDDI目录文件都是一种X
ML文档， XML解决了数据表示的问题。
1.2.6 何为 XSD ？

XML解决了数据表示的问题，但它没有定义一套标准的数据类型，更没有说怎么去扩展这套数据类型。例
如，整型数到底代表什么？ 16位， 32位，还是 64位？

W3C制定的 XML Schema(XSD)就是专门解决这个问题的一套标准。它定义了一套标准的数据类型，并给
出了一种语言来扩展这套数据类型。 Web Service就是用 XSD来作为其数据类型系统的。

2. js 接口
2.1 接口方式说明和优缺点
在开发的过程中，也遇到过需要调用第三方接口的情况，例如笔者在完成的一个股票查询的小 demo中，
就需要调用新浪提供的股票查询的 js接口。另外有一次，在系统中使用了第三方的 GIS系统，调用的也是
js接口。因为调用 js接口的门槛很低，所以有的接口供应商会提供多种调用接口的方式，例如 Web Ser
vivce接口和 js接口等。
对于浏览器来说， script标签的 src属性所指向资源就跟 img标签的 src属性所指向的资源一样，都是一
个静态资源，浏览器会在适当的时候自动去加载这些资源，而不会出现所谓的跨域问题。这样我们就可
以通过该属性将要访问的数据对象引用进当前页面而绕过 js跨域问题。当然，前提是接口必须是返回一
段 js脚本，如一个json对象数组定义的脚本：

modlist = [
{"modname": "mod1", "usernum": 200, "url": "/widget/info/1"},
{"modname": "mod2", "usernum": 300, "url" : "/widget/info/2"},
…
];
但 script标签也有一定的局限性，并不能解决所有 js跨域问题。 script标签的 src属性值不能动态改变以满
足在不同条件下获取不同数据的需求，更重要的是，不能通过这种方式正确访问以 xml内容方式组织的数据。

2.2 开发举例
2.2.1  新浪股票查询的js接口
  功能说明： stockDetail.jsp根据传入的 stockId参数，调用新浪股票查询提供的 js接口返回股票结果信息
，并解析返回结果，将股票信息在页面展示出来。

stockDetail.jsp代码参考如下：

作者: 小文0111 时间: 2018-4-25 15:34
本帖最后由小文0111 于 2018-4-25 15:35 编辑

<% @ page language = " java "  contentType = " text/html; charset=UTF-8 "  pageEncoding = " UTF-8 " %>
<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
<%
String  stockId  =  request.getParameter( " stockId " );
if  (stockId  == null ) {
   stockId  = " 000001 " ;
}
%>
< html >
< head >
   < meta  http-equiv ="Content-Type"  content ="text/html; charset=UTF-8" />
   < title > 股票查询结果 </ title >
   < link  href ="<%=request.getContextPath() %>/css/style.css"  type ="text/css"  rel ="stylesheet" >
   < script  type ="text/javascript"  src ="http://hq.sinajs.cn/list=s_sh<%=stockId %>"  charset ="gb2312" ></script >
      < meta  http-equiv ="pragma"  content ="no-cache" >
      < meta  http-equiv ="cache-control"  content ="no-cache" >
      < meta  http-equiv ="expires"  content ="0" >
</ head >
   < body  onload ="" >
      < div  class ="bodyDiv" >
            < table >
               < tr >
                  < td  colspan ="2"  valign ="bottom"  align ="left"
                     style="width:176px; background: url(<%=request.getContextPath() %>/images/line2_bg.gif) repeat-x;border-bottom: 1px solid #b0bec7;"
                     height ="19" >
                        < span  class ="titleFont" >
                  < font  class ="newTitleFont" >< b > 股票查询结果 </ b ></ font >
                        </ span >
                  </ td >
               </ tr >
               < tr >
                  < td > 指数名称:  </ td >
                  < td >< span  id ="stockName" > </ span ></ td >
               </ tr >
               < tr >
                  < td > 当前点数:  </ td >
                  < td >< span  id ="currentPoint" > </ span ></ td >
               </ tr >
               < tr >
                  < td > 当前价格:  </ td >
                  < td >< span  id ="currentPrice" > </ span ></ td >
               </ tr >
               < tr >
                  < td > 涨跌率:  </ td >
                  < td >< span  id ="ratio" > </ span ></ td >
               </ tr >
               < tr >
                  < td > 成交额(w):  </ td >
                  < td >< span  id =turnVolume > </ span ></ td >
               </ tr >
               < tr >
                  < td  colspan ="2"  valign ="bottom"  align ="right"
                     style="width:176px; background: url(<%=request.getContextPath() %>/images/line2_bg.gif) repeat-x;border-bottom: 1px solid #b0bec7;"
                     height ="19" >
                        < span  class ="titleFont" >
                           < font  class ="newTitleFont" >< b > 1日K线    0返回 </ b ></ font >
                        </ span >
                  </ td >
               </ tr >
            </ table >
      </ div >
      < script  language ="javascript" >
      
      </ script >
</ body >
</ html >

带上 6位 stockId参数（例如：值为 000002），实时的 A股（代号为 s_sh000002）查询结果如下图所示：

在文件头部可看到如下一句引入了新浪提供的 js：

< script  type ="text/javascript"  src ="http://hq.sinajs.cn/list=s_sh<%=stockId %>"  charset ="gb2312"
></ script>
用如下语句获得通过接口查询到的数据：

var stockValue = hq_str_s_sh <% = stockId  %> ;
2.2.2 对外提供js接口

对外提供js接口只需要通过<script src="..." type="..."/>请求的地址返回的是JSON字符串即可。
在本实例中，用到了笔者一篇 JSON文章的实例（《 JSON知识总结入门篇》：http://www.blogjava.net/a
migoxie/archive/2010/09/25/332832.html ），在上面进行了小幅修改，简便起见，没有创建任何的Java类
，提供的对外的js接口是直接通过json.txt，通过该文件返回一个JSON字符串，在实际的应用情况中，可
以是一个Ation等。

json.txt定义了 JSON格式的字符串，并定义放在 json这个变量中， jsInterface.html文件请求远端的一个
路径，而后解析返回的 JSON串，并打印出来。 json.txt在远端的一个服务器上文件的内容如下：

var json={
  "programmers": [
   { "firstName": "阿蜜果", "lastName":"McLaughlin", "email": "brett@newInstance.com" },
   { "firstName": "范范", "lastName":"Hunter", "email": "jason@servlets.com" },
   { "firstName": "高子", "lastName":"Harold", "email": "elharo@macfaq.com" }
],
  "authors": [
   { "firstName": "安安", "lastName": "Asimov", "genre": "science fiction" },
{ "firstName": "Tad", "lastName": "Williams", "genre": "fantasy" },
{ "firstName": "Frank", "lastName": "Peretti", "genre": "christian fiction" }
],
  "musicians": [
   { "firstName": "茂茂", "lastName": "Clapton", "instrument": "guitar" },
{ "firstName": "Sergei", "lastName": "Rachmaninoff", "instrument": "piano" }
]
}

在本地创建一个 jsInterface.html网页，使用 <script type="text/javascript" src=”…”/>请求返回 json字符
串的路径信息，接着进行打印，该文件代码如下：

作者: 小文0111 时间: 2018-4-25 15:34
< html >
   < head >
      < title > JS Interface Test </ title >
      < meta  http-equiv ="Content-Type"  content ="text/html; charset=UTF-8" >
      < script  type ="text/javascript"  src ="http://test.com/json.txt" ></ script >
      < script  type ="text/javascript" >
         alert(json.programmers[ 0 ].firstName  +  ','  +  json.programmers[ 0 ].lastName  +  ','  +  json.programmers[0 ].email);
         alert(json.programmers[ 1 ].firstName  +  ','  +  json.programmers[ 1 ].lastName  +  ','  +  json.programmers[1 ].email);
         alert(json.programmers[ 2 ].firstName  +  ','  +  json.programmers[ 2 ].lastName  +  ','  +  json.programmers[2 ].email);

         alert(json.authors[ 0 ].firstName  +  ','  +  json.authors[ 0 ].lastName  +  ','  +  json.authors[ 0 ].genre);
         alert(json.authors[ 1 ].firstName  +  ','  +  json.authors[ 1 ].lastName  +  ','  +  json.authors[ 1 ].genre);
         alert(json.authors[ 2 ].firstName  +  ','  +  json.authors[ 2 ].lastName  +  ','  +  json.authors[ 2 ].genre);

         alert(json.musicians[ 0 ].firstName  +  ','  +  json.musicians[ 0 ].lastName  +  ','  +  json.musicians[ 0].instrument);
         alert(json.musicians[ 1 ].firstName  +  ','  +  json.musicians[ 1 ].lastName  +  ','  +  json.musicians[ 1].instrument);
      </ script >
   </ head >
   < body >
   </ body >
</ html >

      运行后可看到运行结果与《 JSON 知识总结入门篇》第一个实例的运行结果一致。

3. http 接口
3.1 接口方式说明和优缺点
需要为第三方提供一个接口，本来打算继续使用 Web Service接口，结果那边的开发人员说，他们没有
使用过Web Service接口（是做 IPTV的一个公司），希望我们能够提供 http方式的接口。

另外我们一般在提供 Web Sservice接口的同时，也对外提供 http接口。

3.2 开发实例
3.2.1 向http接口发送消息的使用小程序
本实例对自己提供请求信息为xml格式的http接口，将xml格式的请求信息发给http接口的地址后，将
调用接口的返回消息简单的显示在页面，为了简便起见，笔者没有对js代码进行包装。
该html文件代码如下：

<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
< html >
< head >
      < meta  http-equiv ="Content-Type"  content ="text/html; charset=GB2312" >
      < title > http interface test </ title >
      < meta  http-equiv ="pragma"  content ="no-cache" >
      < meta  http-equiv ="cache-control"  content ="no-cache" >
      < meta  http-equiv ="expires"  content ="0" >
      < script >
      //  XMLHttpRequest
      var  http_request  = false ;
      function  send_request(method, url, content, responseType, callback)  {
         http_request  = false ;
            //  XMLHttpRequest
            if (window.XMLHttpRequest)  {
               // Mozilla
               http_request  = new  XMLHttpRequest();
               if (http_request.overrideMimeType)  {
                  // MIME
                  http_request.overrideMimeType( " text/xml " );
               }
         } else if (window.ActiveXObject)  {
               // IE
               try {
                  http_request  = new  ActiveXObject( " Msxml2.XMLHTTP " );
               } catch  (e)  {
                  try {
                     http_request  = new  ActiveXObject( " Microsoft.XMLHTTP " );
                  }
                  catch  (e) {}
               }
         }
            if ( ! http_request)  {
               window.alert( " XMLHttpRequest create Error. " );
               return false ;
         }
            if (responseType.toLowerCase()  == " text " ||  responseType.toLowerCase()  == " xml " )  {
               http_request.onreadystatechange  =  callback;
         } else {
               window.alert( " error responseType. " );
               return false ;
         }

            if (method.toLowerCase()  == " get " )  {
               http_request.open(method, url,  true );
         } else if (method.toLowerCase()  == " post " )  {
               http_request.open(method, url,  true );
               http_request.setRequestHeader( " Content-Type " ,  " text/xml " );
         } else {
               window.alert( " http method error. " );
               return false ;
         }
         http_request.send(content);
      }

      function  submitInfo()
      {
            var  form  =  document.httpTestForm;
            var  pathInfo  =  form.pathInfo.value;
            var  xmlInfo  =  form.xmlInfo.value;
         form.returnInfo.value  = " wait " ;
         send_request( " POST " , pathInfo, xmlInfo,  " xml " , showHttpTestBack);

      }
      function  showHttpTestBack()  {
            if (http_request.readyState  == 4 )
            {
               if (http_request.status  == 200 )
               {
                  var  responseInfo  =  http_request.responseText;
                  var  form  =  document.httpTestForm;
                  form.returnInfo.value  =  responseInfo;
               }
         }
      }
      </ script >
</ head >

< body >
      < form  name ="httpTestForm"  action =""  method ="post" >
         < table  width ="100%"  border ="1" >
            < tr >
                  < td  colspan ="2"  align ="center" >
                     < b > http interface Test </ b >
                  </ td >
            </ tr >
            < tr >
                  < td > xmlInfo: </ td >
                  < td >
                     < textarea  id ="xmlInfo"  name ="xmlInfo"  cols ="100"  rows ="5" ></ textarea >
                  </ td >
            </ tr >
            < tr >
                  < td > pathInfo: </ td >
                  < td >
                     < input  type ="text"  name ="pathInfo"  value ="http://192.168.2.154:16000/Mbd/http/video"  size="100" />
                  </ td >
            </ tr >
            < tr >
                  < td > returnInfo: </ td >
                  < td >
                     < textarea  name ="returnInfo"  id ="returnInfo"  cols ="100"  rows ="5" ></ textarea >
                  </ td >
            </ tr >
            < tr >
                  < td  colspan ="2"  align ="center" >
                     < input  type ="button"  name ="submitButton1"  value ="Submit"  onclick ="javascript:submitInfo()"  />
                  </ td >
            </ tr >

         </ table >
      </ form >
</ body >
</ html >

访问该页，页面很简单，输入正确的 xml请求消息，和正确的路径信息，点击“ Submit”按钮，通过 ajax调用
http端口，并在成功取得信息后将返回结果显示在最后一个文本框：

3.2.2 作为提供商提供http接口

在这个实例中，服务器提供了一个 http接口，在这里是一个 jsp页面的访问地址，实际应用过程中，可以是Servlet或 Action的访问地址，在这个实例中，客户端发送 http get发送请求，带上了 hotel（宾馆信息）和name（顾客姓名）， http接口程序拿到参数信息后，根据一定算法检查分配空闲房间号，这里为了简便起见，只是随机的生成一个数字返回给客户端。 http接口的简单程序 httpInterface.jsp如下所示：

<% @ page language = " java "  contentType = " text/html; charset=UTF-8 "  pageEncoding = " UTF-8 " %>
<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
<%
Double  room  = 500 *  Math.random();
out.write( " hotel= " +  request.getParameter( " hotel " )
            + " ;name= " +  request.getParameter( " name " )
            + " ;room= " +  room.intValue());
out.close();
%>
< html >
      < head >
      < meta  http-equiv ="Content-Type"  content ="text/html; charset=UTF-8" />
      < title > http Interface </ title >
      < meta  http-equiv ="pragma"  content ="no-cache" >
      < meta  http-equiv ="cache-control"  content ="no-cache" >
      < meta  http-equiv ="expires"  content ="0" >
      </ head >
   < body >
      </ body >
</ html >

可在 IE 上带上参数访问这个地址，可看到参考的结果信息，例如访问 http://IP:端口 / 应用名称/httpInterface.jsp?hotel=motel&name=amigo ，参考返回结果如下：

hotel=motel;name=amigo;room=407

欢迎光临 51Testing软件测试论坛 (http://bbs.51testing.com/)