ASP.NET Atlas での Web サービスの呼び出し - リモート Web サービス (Yahoo! Weather インスタンス) を呼び出すマッシュアップの作成

著者：Eve Cole 更新時間：2009-06-30 16:41:42

著者: Dflying Chen ( http://dflying.cnblogs.com/ )
前回の記事 (ASP.NET Atlas での Web サービスの呼び出し - リモート Web サービスを呼び出すマッシュアップの作成 (基礎知識と簡単な例)) では、Atlas でのリモート Web サービスのマッシュアップの基礎知識と最も基本的な例を紹介しました。それはまったく役に立ちません。今日はこのトピックに戻り、より複雑ではありますが、やや役立つ例として Yahoo! 天気を紹介します。

ナンセンスな話はこれくらいにして、まず Yahoo! Weather サービスについて理解しましょう。Yahoo! は Web サイト ( http://weather.yahoo.com/ ) で天気予報サービスを提供しており、Web サービスインターフェイス ( http :/ )も提供しています。 /developer.yahoo.com/weather/ )
上記の 2 つの Web ページから、Yahoo! が提供する天気予報サービスの URL がhttp://xml.weather.yahoo.com/forecastrssであることがわかります。

p: 場所コード。天気をクエリする必要があります (このコードはhttp://weather.yahoo.com/のさまざまな場所で確認できます)。
u: 返された結果の温度の単位。f は華氏を表し、c は摂氏を表します。
この Yahoo! 天気サービスは非常に簡単であるようですが、うまく機能するかどうかをテストしてみましょう。まず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" エンコーディング="UTF-8" スタンドアロン="はい" ?>
<rss version="2.0" xmlns:yweather=" http://xml.weather.yahoo.com/ns/rss/1.0 " xmlns:geo=" http://www.w3.org/2003/01/geo /wgs84_pos #">
<チャンネル>
<title>Yahoo! 天気 - 上海</title>
<link>http://us.rd.yahoo.com/dailynews/rss/weather/Shanghai__CH/*http://xml.weather.yahoo.com/forecast/CHXX0116_c.html</link>
<description>中国、上海の Yahoo! 天気</description>
<言語>英語</言語>
<lastBuildDate>2006 年 5 月 25 日木曜日、午前 11:00 CST</lastBuildDate>
<ttl>60</ttl>
<yweather:location city="上海" 地域="" country="CH" />
<yweather:units 温度="C" 距離="km" 圧力="mb" 速度="kph" />
<yweather:wind cold="21" 方向="260" 速度="14" />
<yweather:大気湿度 = 78" 可視性 = 299" 気圧 = 0" 上昇 = 0" />
<yweather:astronomy 日の出="午前 4 時 52 分" 日の入り = 午後 6 時 50 分" />
<イメージ>
<title>Yahoo!天気</title>
<幅>142</幅>
<高さ>18</高さ>
<リンク>http://weather.yahoo.com/</リンク>
<url>/u/info_img/2009-06/30/main_142b.gif</url>
</image>
<アイテム>
<title>中国中部時間午前 11 時における上海の状況</title>
<geo:lat>31.17</geo:lat>
<geo:long>121.43</geo:long>
<link>http://us.rd.yahoo.com/dailynews/rss/weather/Shanghai__CH/*http://xml.weather.yahoo.com/forecast/CHXX0116_c.html</link>
<pubDate>2006 年 5 月 25 日木曜日、午前 11:00 CST</pubDate>
<yweather:condition text="霧" code="20" temp="21" date="2006 年 5 月 25 日木曜日午前 11:00 CST" />
<説明>
<![CDATA[
<img src=" <b>現在の状況:</b><br />
霧、21℃<BR /><BR />
<b>予測:</b><BR />
木 - 散在雷雨高:25 低:20<br />
金～午前雨高：26 低：18<br />
<br />
<a href=" http://us.rd.yahoo.com/dailynews/rss/weather/Shanghai__CH/*http://xml.weather.yahoo.com/forecast/CHXX0116_c.html"> Yahoo! での完全な天気予報天気</a><BR/>
（ウェザーチャンネル提供）<br/>
]]>
</説明>
<yweather:forecast day="木" date="2006 年 5 月 25 日" low="20" high="25" text="散在雷雨" code="38" />
<yweather:forecast day="Fri" date="2006 年 5 月 26 日" low="18" high="26" text="午前のシャワー" code="39" />
<guid isPermaLink="false">CHXX0116_2006_05_25_11_0_CST</guid>
</アイテム>
</チャンネル>
</rss>

提供される情報が非常に包括的であることがわかります (日の出と日の入りの時間も...)。 ) では、このサービスをマッシュアップするための asbx ブリッジページを作成しましょう。

まず、記事「ASP.NET Atlas での Web サービスの呼び出し - リモート Web サービスを呼び出すマッシュアップの作成 (基礎知識と簡単な例)」の asbx ステートメントを参照して、次の段落を記述できます。

<?xml version= "1.0" エンコーディング="utf-8" ?>
<bridge namespace="Dflying" className="YahooWeatherService">

<メソッド名="GetWeather">
<入力>
<パラメータ名="p" />
<パラメータ名="u" 値="c" />
</入力>
</メソッド>
</ブリッジ>

で：
<bridge> の namespace 属性と className 属性、および <method> の name 属性を使用すると、Dflying.YahooWeatherService.GetWeather() などのメソッドシグネチャを通じてクライアント JavaScript でこのマッシュアップにアクセスできます。
<proxy> の serviceUrl 属性は、Yahoo! Weather Service の URL を指定します。
GetWeather メソッドは、上記の 2 つのパラメーター p と u を定義します。u パラメーターのデフォルト値を c (摂氏を表す) として指定し、p パラメーターは呼び出し元によって渡されます。
実際にはこの手順で十分です。クライアントは上記のブラウザに表示される XML 文字列を受け取り、クライアント上で処理して表示できます。しかし、クライアントによる XML の処理はそれほど簡単でも効率的でもないため、不要な情報をネットワーク上に送信しすぎるのも無駄です。そこで、ここでは asbx の組み込み Transformer を使用してこの XML を処理し、関心のあるコンテンツを抽出して、それを JSON 形式でクライアントに送信します。次の段落を <method> セクションに追加します:

<transforms> ステートメントは、このマッシュアップメソッドの戻り値が一部のトランスフォーマーによって変更されることを示し、Microsoft.Web.Services.XPathBridgeTransformer 型のトランスフォーマーを宣言します。これは、XPath 式が変換に使用されることを意味します。この XPathBridgeTransformer では次の部分を宣言する必要があります。
name はセレクターの属性セグメントであり、指定された value 属性は XPath 式であり、XPathBridgeTransformer 全体で使用されるデータセグメントを選択します。
name は、この XML ファイル内の名前空間マッピングを指定する namespaceMapping の辞書セグメントです。次のノード選択プロセスで特定の名前空間を使用する場合、その宣言はここにある必要があります。ここでは、以下で使用するため、yweather へのマッピングを追加します。
name は selectedNodes の辞書セグメントであり、各項目の value 属性は XML から対応する値を選択するために使用される XPath 文字列であり、name 属性は JavaScript で対応する属性名を指定するために使用されます。ここでは例として、3 つのコンテンツのみを取得しました。上で指定した namespaceMapping が CurrentCondition の XPath で使用されていることがわかります。
XPath について詳しくは説明しませんが、XPath に興味がある人や詳しくない人は、オンラインリソースがたくさんありますので、自分で検索してみてください。他のタイプのトランスフォーマーについてはあまり詳しくありませんので、今後遭遇したらお話します。完成した YahooWeatherBridge.asbx ファイルは次のとおりです:

<?xml version="1.0"coding="utf-8" ?>
<bridge namespace="Dflying" className="YahooWeatherService">

<メソッド名="GetWeather">
<入力>
<パラメータ名="p" />
<パラメータ名="u" 値="c" />
</入力>
<変換>
<transform type="Microsoft.Web.Services.XPathBridgeTransformer">
<データ>
<attribute name="セレクター" value="チャンネル" />
<dictionary name="namespaceMapping">
<item name="yweather" value=" http://xml.weather.yahoo.com/ns/rss/1.0 " />
</辞書>
<dictionary name="selectedNodes">
<item name="タイトル" value="タイトル" />
<item name="説明" value="項目/説明" />
<item name="CurrentCondition" value="item/yweather:condition/@text" />
</辞書>
</データ>
</変換>
</変換>
</メソッド>
</ブリッジ>

次に、テストする ASP.NET ページを作成します。まず、1,000 回繰り返された ScriptManager と Bridge への参照がまだあります: <atlas:ScriptManager ID="sm" runat="server">
<サービス>
<atlas:ServiceReference Path="YahooWeatherBridge.asbx" />
</サービス>
</atlas:スクリプトマネージャー>
次に、HTML Select 要素があり、いくつかの都市と対応する都市コードがリストされます。

<select id="場所">
<option selected="selected" value="CHXX0116">スイス、上海</option>
<option value="USCA0746">カリフォルニア州マウンテンビュー</option>
<option value="CHXX0008">スイス、北京</option>
</選択>
サービスへの呼び出しをトリガーするために使用される HTML ボタン:

<input id="getWeather" type="button" value="天気を取得" onclick="return getWeather_onclick()" />
結果を表示するには HTML の一部が使用されます:

<div id="result" style="display: none;">
<div style="background-color: Gray; font-weight: ballad;">タイトル</div>
<div id="title"></div>
<div style="background-color: Gray; font-weight: ballad;">説明</div>
<div id="説明"></div>
</div>

次に、JavaScript が Dflying.YahooWeatherService.GetWeather() を通じて呼び出され、メソッドが返された後に変換された値がページに出力されることがわかります。
// 新しいアトラスの「選択」コントロール
var place = new Sys.UI.Select($('place'));

// ブリッジメソッドを呼び出します
Dflying.YahooWeatherService.GetWeather({'p': place.get_selectedValue()}, onGetComplete);
}
関数 onGetComplete(結果) {
$('result').style.display = "ブロック";
$('title').innerHTML = result[0].Title;
$('description').innerHTML = result[0].Description;
}