在ASP.NET Atlas中调用Web Service——创建Mashup调用远端Web Service（Yahoo!天气实例）...

最新推荐文章于 2019-05-01 01:15:35 发布

weixin_34107955

最新推荐文章于 2019-05-01 01:15:35 发布

阅读量130

点赞数

文章标签：人工智能 javascript ui ViewUI

本文介绍如何使用ASP.NET Atlas中的Mashup功能调用Yahoo!Weather服务，获取并展示天气预报数据。文章详细讲解了创建Mashup调用远端WebService的过程，包括配置asbx桥接文件、使用XPathBridgeTransformer处理XML响应以及在客户端显示结果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

作者：Dflying Chen （ http://dflying.cnblogs.com/ ）

在前一篇文章（在ASP.NET Atlas中调用Web Service——创建Mashup调用远端Web Service（基础知识以及简单示例））中，我介绍了一些Atlas中对远程Web Service进行Mashup的基础知识，并给出了一个最基础的没有丝毫用处例子。今天再回到这个话题上，我将给出一个更复杂点的，但有一些用处的例子——Yahoo! Weather。

废话到此为止，让我们先熟悉一下Yahoo! Weather服务：Yahoo!在其网站上提供了天气预报服务（http://weather.yahoo.com/），并且它也提供了Web Service的接口（http://developer.yahoo.com/weather/）
从上面两个网页上面，我们可以知道Yahoo!提供的天气Service的URL为http://xml.weather.yahoo.com/forecastrss，该服务还有两个参数：

p：要查询天气的地点代码（可以在http://weather.yahoo.com/查询到不同地方的这个代码）。
u：返回结果中温度的单位，f代表华氏度，c代表摄氏度。

看来这个Yahoo! Weather服务还挺简单的，让我们测试下好不好用。先到http://weather.yahoo.com/查出来上海的地点代码为CHXX0116。然后在浏览器中输入http://xml.weather.yahoo.com/forecastrss?p=CHXX0116&u=c，嗯，返回了如下的一段不是很复杂的XML：

Yahoo Weather Service XML Result

<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>

<title>Yahoo! Weather - Shanghai, CH</title>

<description>Yahoo! Weather for Shanghai, CH</description>

<yweather:location city="Shanghai" region="" country="CH" />

<yweather:units temperature="C" distance="km" pressure="mb" speed="kph" />

<yweather:wind chill="21" direction="260" speed="14" />

<yweather:atmosphere humidity="78" visibility="299" pressure="0" rising="0" />

<yweather:astronomy sunrise="4:52 am" sunset="6:50 pm" />

<image>

<title>Yahoo! Weather</title>

</image>

<item>

<title>Conditions for Shanghai, CH at 11:00 am CST</title>

<geo:lat>31.17</geo:lat>

<geo:long>121.43</geo:long>

<yweather:condition text="Fog" code="20" temp="21" date="Thu, 25 May 2006 11:00 am CST" />

<![CDATA[

<b>Current Conditions:</b><br />

Fog, 21 C<BR /><BR />

<b>Forecast:</b><BR />

Thu - Scattered Thunderstorms. High: 25 Low: 20<br />

Fri - AM Showers. High: 26 Low: 18<br />

<br />

<a href="http://us.rd.yahoo.com/dailynews/rss/weather/Shanghai__CH/*http://xml.weather.yahoo.com/forecast/CHXX0116_c.html">Full Forecast at Yahoo! Weather</a><BR/>

(provided by The Weather Channel)<br/>

]]>

</description>

<yweather:forecast day="Thu" date="25 May 2006" low="20" high="25" text="Scattered Thunderstorms" code="38" />

<yweather:forecast day="Fri" date="26 May 2006" low="18" high="26" text="AM Showers" code="39" />

</item>

</channel>

</rss>

我们可以看到，它提供的信息非常全面（连日出日落时间都有……），下面让我们书写asbx Bridge页面来对这个Service进行Mashup。

首先，参考在ASP.NET Atlas中调用Web Service——创建Mashup调用远端Web Service（基础知识以及简单示例）这篇文章中的那个asbx的声明，我们可以写出如下一段：

<? xml version="1.0" encoding="utf-8" ?>

< bridge namespace ="Dflying" className ="YahooWeatherService" >

< proxy type ="Microsoft.Web.Services.BridgeRestProxy"

serviceUrl ="http://xml.weather.yahoo.com/forecastrss" />

< method name ="GetWeather" >

< input >

< parameter name ="p" />

< parameter name ="u" value ="c" />

</ input >

</ method >

</ bridge >

其中：

<bridge>的namespace和className属性以及<method>的name属性让我们在客户端JavaScript中可以通过Dflying.YahooWeatherService.GetWeather()这样的方法签名来访问这个Mashup。
<proxy>的serviceUrl属性指定了Yahoo! Weather Service的URL。
GetWeather方法中定义了上面列出来的p和u两个参数，其中u参数我们指定了它的默认值为c（代表摄氏度），p参数将由调用者负责传过来。

写到这一步其实也够了，客户端将收到上面浏览器中看到的那一段XML String，并且可以在客户端进行处理并显示。但客户端对XML的处理并不是那么容易，也不是那么高效，同时通过网络传输太多不必要的信息也是一种浪费。所以这里我们利用asbx中内建的Transformer对这段XML处理一下，提取出我们感兴趣的内容并以JSON的形式发给客户端。在<method>段中加入下面一段：

< transforms >

< transform type ="Microsoft.Web.Services.XPathBridgeTransformer" >

< data >

< attribute name ="selector" value ="channel" />

< dictionary name ="namespaceMapping" >

< item name ="yweather" value ="http://xml.weather.yahoo.com/ns/rss/1.0" />

</ dictionary >

< dictionary name ="selectedNodes" >

< item name ="Title" value ="title" />

< item name ="Description" value ="item/description" />

< item name ="CurrentCondition" value ="item/yweather:condition/@text" />

</ dictionary >

</ data >

</ transform >

</ transforms >

其中 <transforms> 声明表示这个Mashup 方法的返回值将会被一些transformer 改变一下，里面声明了一个类型为 Microsoft.Web.Services.XPathBridgeTransformer 的transformer ，表示将用 XPath 表达式来转换。在这个XPathBridgeTransformer 中要声明如下部分：

name为selector的一个attribute段，其中指定的value属性为一个XPath表达式，将选取整个XPathBridgeTransformer将用到的数据段。
name为namespaceMapping的一个dictionary段，其中指定了这个XML文件中的namespace映射。如果在下面的选择节点过程中我们用到了某个namespace，那么这里就必须有它的声明。这里我们在其中添加一个对yweather的映射，因为下面要用到。
name为selectedNodes的一个dictionary段，其中每一个item的value属性是一个XPath String，用来从XML中选择出相应的值，name属性用来指定相应的在JavaScript中的属性名称。这里作为示例，我只取得其中三段内容，您可以看到，其中CurrentCondition的XPath中用到了上面指定的namespaceMapping。

关于XPath的知识，我就不多讲了，感兴趣或是不太熟悉的朋友可以自行Google，网上资源很多。关于其他类型的Transformer，我也不是很熟悉，今后如果遇到了我再讲讲。完成后的YahooWeatherBridge.asbx文件如下：

<? xml version="1.0" encoding="utf-8" ?>

< bridge namespace ="Dflying" className ="YahooWeatherService" >

< proxy type ="Microsoft.Web.Services.BridgeRestProxy"

serviceUrl ="http://xml.weather.yahoo.com/forecastrss" />

< method name ="GetWeather" >

< input >

< parameter name ="p" />

< parameter name ="u" value ="c" />

</ input >

< transforms >

< transform type ="Microsoft.Web.Services.XPathBridgeTransformer" >

< data >

< attribute name ="selector" value ="channel" />

< dictionary name ="namespaceMapping" >

< item name ="yweather" value ="http://xml.weather.yahoo.com/ns/rss/1.0" />

</ dictionary >

< dictionary name ="selectedNodes" >

< item name ="Title" value ="title" />

< item name ="Description" value ="item/description" />

< item name ="CurrentCondition" value ="item/yweather:condition/@text" />

</ dictionary >

</ data >

</ transform >

</ transforms >

</ method >

</ bridge >

现在创建一个ASP.NET Page 测试一下，首先依然是重复了一千遍的ScriptManager ，还有对Bridge 的引用：

< atlas:ScriptManager ID ="sm" runat ="server" >

< Services >

< atlas:ServiceReference Path ="YahooWeatherBridge.asbx" />

</ Services >

</ atlas:ScriptManager >

然后一个HTML Select 元素，里面列入了几个城市以及相应的城市代码：

< select id ="place" >

< option selected ="selected" value ="CHXX0116" > Shanghai, CH </ option >

< option value ="USCA0746" > Mountain View, CA </ option >

< option value ="CHXX0008" > Beijing, CH </ option >

</ select >

一个HTML Button ，用来触发对Service 的调用：

< input id ="getWeather" type ="button" value ="Get Weather" onclick ="return getWeather_onclick()" />

一段HTML 用来显示结果：

< div id ="result" style ="display: none;" >

< div style ="background-color: Gray; font-weight: bold;" > Title </ div >

< div id ="title" ></ div >

< div style ="background-color: Gray; font-weight: bold;" > Description </ div >

< div id ="description" ></ div >

</ div >

然后是JavaScript ，可以看到通过Dflying.YahooWeatherService.GetWeather() 调用了Mashup ，并在方法返回后把经过transform 的值输出到了页面上：

function getWeather_onclick()

{

// new atlas 'Select' control

var place = new Sys.UI.Select($('place'));

// invoke the bridge method

Dflying.YahooWeatherService.GetWeather(

{'p': place.get_selectedValue()}, onGetComplete);

}

function onGetComplete(result)

{

$('result').style.display = "block";

$('title').innerHTML = result[0].Title;

$('description').innerHTML = result[0].Description;

}

最后浏览器中看一下结果，上海天气：

Mountain View天气：

该实例程序的源代码可以在此下载：http://files.cnblogs.com/dflying/YahooWeatherBridge.zip