240 likes | 460 Views
Ajax 编程技术 第七章 Web 服务、 API 和 Mashup. 7.1 Web 服务. 什么是 Web 服务 Web 是穿过网络或 Internet 提供数据的一种方式。它有万维网联盟 (W3C) 组织标准化。 Web 服务评价 优点:能够实现隐蔽地提供数据; 缺点: 也是它的隐蔽性; Web 看起来太复杂; 开发、维护的成本较高; 若以 XML 格式返回数据,客户端需要进一步处理数据,减慢应用程序的执行。. 7.1 Web 服务. 公共 Web 服务 许多企业都向大众提供公共免费 Web 服务,下面是一些常见的典型公共 Web 服务:
E N D
7.1 Web服务 • 什么是Web服务 Web是穿过网络或Internet提供数据的一种方式。它有万维网联盟(W3C)组织标准化。 • Web服务评价 • 优点:能够实现隐蔽地提供数据; • 缺点: • 也是它的隐蔽性; • Web看起来太复杂; • 开发、维护的成本较高; • 若以XML格式返回数据,客户端需要进一步处理数据,减慢应用程序的执行。 7-2
7.1 Web服务 • 公共Web服务 许多企业都向大众提供公共免费Web服务,下面是一些常见的典型公共Web服务: • Yahoo Web Service服务(http://developer.yahoo.com) • Amazon Web Service服务(http://aws.amazon.com) • Last.FM(http://www.audioscrobbler.net/data/Webservices/) 7-3
7.1 Web服务 • 使用第三方Web服务 我们介绍一个简单的示例。启动浏览器,输入Web服务的URL 就行了。 • 例1:典型的公共Web服务是股票报价、网上天气预报服务。这里介绍一个股票报价应用。 • 打开浏览器,在地址栏中键入:http://www.webservicex.net/stockquote.asmx 7-4
7.1 Web服务 • 单击GetQuote链接,可以看到一个新页面,在symbol文本框中输入“MSFT”,然后单击Invoke按钮。 7-5
7.1 Web服务 • 可以看到Microsoft公司的股票价格: 7-6
7.1 Web服务 • 示例说明 向Web服务器发送一个传送Microsoft公司股票信息的请求,Web服务器则返回一个已经已经包装在字符串元素内的XML文档。 7-7
7.2 Web服务的结构 可以将Web服务的结构看成是具有以下4个循环步骤的过程: • 客户机越过一个协议调用Web服务。通常这个协议是HTTP协议(也有可能是SMTP、HTTPS协议); • 客户机向服务器发送一个方法,该方法包含需要Web服务的说明; • 收到请求方法的服务器返回一个值或一个确认,该确认表示服务器已经收到该方法; • 客户机获得结果,并处理已接收的信息。 7-8
7.2 Web服务的结构 Web服务标准规定使用SOAP(Simple Object Access Protocol,简单对象访问协议)来发送并接收Web服务中的数据。 要做的工作不仅仅是把数据存放进查询字符串中,或使用SOAP把数据填入文档。需要做更多的工作: • 创建一个特定的SOAP文档,通常,SOAP消息是标准的XML文档。 • 接着接收到从Web服务中返回的SOAP格式消息,然后处理此响应。 实际上,SOAP一直存在非议,因为和HTTP-GET/POST方法及REST方法相比,SOAP方法太复杂。 7-9
7.2 Web服务的结构 • REST方法 如果使用REST方法,必须提供一个URL,并假设Web服务将返回一个XML片段。 例如:下面的请求是一个REST查询: http://www.Webservicex.net/Stockquote.asmx/GetQuote?symbol=MSFT 如果正常的话,将返回到一个XML片段: <?xml version=“1.0” encoding=“utf-8”> <string xmlns= http://www,WebserviceX.NET/ ><StockQuotes><Stock> <Symbol>MSFT</Symbol><Last>28.52</Last> <Data>1/18/2009</Data> <Time>4:00</Time>Change>0.00</Change><Open>N/A</Open><High>N/A</high> <Low>N/A</Low><Volume>0</Volume><MktCao>284.38<MktCap> <PreviousCloss>28.52</PreviousClose> <percentageChange>0.00%</PercentageChange><AnRange>21.46-28.70</annRange> <Earns>1.196</Earns><P-E>23.85</P-E><Name>MICROSOFT CP</Name></Stock> </StockQuote></string> 7-10
7.2 Web服务的结构 • REST方法评价 • 优点: • 能获取存储在XML中的消息; • 使用HTTP传送; • 使用HTTP方法GET/POST/PUT; • 使用URL; • 可以使用HTTP认证安全; • 容易使用 • 缺点: • 安全不如SOAP健壮; • 当使用GET时,URL的长度受到限制 7-11
7.2 Web服务的结构 Amazon和eBay两家公司都提供REST方法,可让人们访问这两家公司的产品信息的Web服务。同时,新闻种子也围绕REST设计(如Atom RSS),过程和设备可以进行多次调用,或多次调用后不会引起大问题。 7-12
7.2 Web服务的结构 • SOAP方法 和REST方法相比,SOAP还要维护重要功能,例如,消息的优先权,消息的终止、安全属性及其加密、消息的路由选择和关键数据的使用,它不采用通过URL调用Web服务。 当使用SOAP时,消息被作为一个SOAP文档发送到服务器。SOAP文档包括<SOAP:Envelope>元素,它指定一个命名空间。该信封元素包括以下两种元素: • <SOAP:Header>元素:类似于HTTP标题,还可以传递消息; • <SOAP:Body>元素:包含要调用的Web服务名称以及指定响应返回方式的参数和消息。 可见,SOAP方法要比RESTF方法难。因为它不仅要遵守XML规则,还要坚持SOAP规则,此外还要编码返回的文档。 7-13
7.3 将Web服务集成到Ajax应用程序 将Web服务添加到Ajax应用程序中很容易。XMLHttpRequest对象具有Open方法,该方法采用3个参数,其中一个参数是URL。可以放置Web服务的端点作为参数,代替URL传递。 • 使用XMLHttpRequest交叉URL引用 例如,下列代码是调用同一网站的某张网页: var url = “stockquote.asmx/GetQuote?symbol=‘MSFT’; xmlhttp.open(“GET”,url,true); 这与使用其它请求没什么两样。 7-14
7.3 将Web服务集成到Ajax应用程序 但如果URL是外部地址,这就是交叉URL引用: var url = “http://www.webservicex.net/stockquote.asmx/GetQuote?symbol=‘MSFT’; xmlhttp.open(“GET”,url,true); 如果使用IE浏览器,运行结果可 能发生三种情形之一,这取决与IE的 工具菜单中的“Internet选项”→“安全” →“自定义级别”的一个设置: • 如果默认值为“提示”,则在首次 显示时出现对话框,进行设置; • 若是“启用”,不会出现设置对话框; • 如果是“禁用”,则会出现“存取抵 赖”错误。 7-15
7.3 将Web服务集成到Ajax应用程序 • JavaScript同源策略 同源策略即不允许交叉URL加载。就是禁止某个URL源的网页装载另一个URL源的网页,目的是避免恶意病毒的流行。它在mozilla标准上实现,如netScape、Firefox浏览器。 • 什么叫同源 假设有一个URL:http://store.company.com/dir/page.html,那么,http://store.company.com/dir2/other.html、http://store.company.com/dir/inner/another.html与之同源;而https://store.company.com/secure.html 、http://store.company.com:81/dir/etc.html 、http://news.company.com/dir/other.html 则不是与指定的URL同源,因为它们要么协议不同,要么端口不同,要么主机不同。 7-16
7.3 将Web服务集成到Ajax应用程序 但有一个例外,如果脚本对当前域设置了一个后缀: document.domain = "company.com"; 那么,http://company.com/dir/page.html 则认为是同源。而基于相同的原因,不能再将document.domain 设置成另一个名字!比如: document.domain = "othercompany.com"; 7-17
7.3 将Web服务集成到Ajax应用程序 • 创建应用程序代理 见教材p175 7-18
7.4 使用脚本标记 第二种方法是使用脚本标记。该方法为: • 移动XMLHttpRequest对象,并在<script>标记的src属性中对Web服务进行调用; • 该Web服务必须以JSON格式返回输出; • 检索具有JSON格式的数据。 JSON格式在11章介绍。 例:这里仅作简单介绍,我们创建一个以JSON格式返回其输出的Web服务示例,来演示如何完成yahoo的TimeService。 7-19
7.4 使用脚本标记 • Index.html: <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>Web Service example using Dynamic Script Tag</title> <script type="text/javascript" src="webservice2.js"></script> </head> <body> <form id="form1" name="form1"> <input type="button" onclick="dynamicTag();" value="Click button to use web service" /> </form> </body> </html> 7-20
7.4 使用脚本标记 • webservice2.js: function getTime(JSONData) { //回调函数 if (JSONData != null) { alert(TimeStampToDate(JSONData.Result.Timestamp)); } } function TimeStampToDate(xmlDate) { return new Date(xmlDate); //将时间戳格式转换成可读取的日期格式 } function dynamicTag() { request = "http://developer.yahooapis.com/TimeService/V1/getTime?appid=YahooDemo&output=json&callback=getTime&format=ms"; var head = document.getElementsByTagName("head").item(0); var script = document.createElement("script"); script.setAttribute("type", "text/javascript"); script.setAttribute("src", request); head.appendChild(script); } 7-21
7.4 使用脚本标记 • 运行状况: 这是一种常见的Web 服务用法。但遗憾的是, 这里不能保证返回的是 JSON格式而不是标准的 XML格式。 如果Web只返回一个标准的XML文档,那么,因为我 们已经将该脚本的src属性赋值给Web服务的输出,所以 将引发一个脚本错误。 7-22
7.5 使用API 多数Web公司,如象Amazon, Microsoft, Google, Yahoo, ebay 等公司,不但提供Web服务,他们的Web站点也提供API服务,用户可以通过JavaScript直接调用这些API功能。下面列出了常见的API功能: • Flickr ( www.flickr.com/services/ ) • YouTube ( www.youtube.com/dev ) • Google Maps (www.google.com/apis/maps ) • eBay (http://developer.ebay.com/) • del.icio.us(www.programmableWeb.com/api/del.icio.us) • Virtual Earth(www.viavirtualearth.com) 7-23
7.5 使用API • Web服务与PAI之间的区别 • Web服务使用HTTP-GET/HTTP-POST,返回XML文档,或使用SOAP请求返回SOAP响应文档。Web必须遵守W3C.org规定的标准; • API是指通过编程语言与指定应用程序交互的一组方法,它不必符合所有标准。 7-24