ผู้แต่ง: Dflying Chen ( http://dflying.cnblogs.com/ )
ในบทความก่อนหน้านี้ (การเรียกบริการเว็บใน ASP.NET Atlas - การสร้าง Mashup เพื่อเรียกบริการเว็บระยะไกล (ความรู้พื้นฐานและตัวอย่างง่ายๆ)) ฉันได้แนะนำความรู้พื้นฐานเกี่ยวกับ Mashup สำหรับบริการเว็บระยะไกลใน Atlas และยกตัวอย่างพื้นฐานที่สุด นั่นไม่มีประโยชน์เลย กลับมาที่หัวข้อนี้วันนี้ฉันจะยกตัวอย่างที่ซับซ้อนมากขึ้น แต่ค่อนข้างมีประโยชน์ - Yahoo!
เรื่องไร้สาระ เรา มา ทำความรู้จักกับบริการ Yahoo! Weather กันก่อน: Yahoo! /developer.yahoo.com/weather/ )
จากหน้าเว็บสองหน้าข้างต้น เราจะทราบได้ว่า URL ของบริการสภาพอากาศที่ Yahoo! ให้บริการคือ http://xml.weather.yahoo.com/forecastrss บริการนี้มีพารามิเตอร์สองตัวด้วย:
p: รหัสตำแหน่งโดยที่ ต้องสอบถามสภาพอากาศ ( สามารถตรวจสอบ Code นี้ได้จากที่ต่างๆ ได้ที่ 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 ที่ไม่ซับซ้อนมากต่อไปนี้:
ผลลัพธ์ XML ของ Yahoo Weather Service
<ช่อง>
http://us.rd.yahoo.com/dailynews/rss/weather/Shanghai__CH/*http://xml.weather.yahoo.com/forecast/CHXX0116_c.html
<ภาษา>en-us
<ภาพ>
<ความกว้าง>142
<ความสูง>18
http://weather.yahoo.com/
<รายการ>
http://us.rd.yahoo.com/dailynews/rss/weather/Shanghai__CH/*http://xml.weather.yahoo.com/forecast/CHXX0116_c.html
<คำอธิบาย>
" />
เงื่อนไขปัจจุบัน:
หมอก 21 C
พยากรณ์:
พฤ - พายุฝนฟ้าคะนองกระจาย สูง: 25 ต่ำ: 20
ศุกร์ - บ่าย ฝนตกสูงสุด: 26 ต่ำสุด: 18
พยากรณ์ฉบับเต็มได้ ที่ Yahoo! สภาพอากาศ
(จัดทำโดย The Weather Channel)
-
เราจะเห็นว่าข้อมูลที่ให้นั้นครอบคลุมมาก (แม้แต่เวลาพระอาทิตย์ขึ้นและพระอาทิตย์ตก... ) ให้เราเขียนหน้า asbx Bridge ไปที่ Mashup this Service
ขั้นแรก อ้างถึงคำสั่ง asbx ในบทความ การเรียกบริการเว็บใน ASP.NET Atlas - การสร้าง Mashup เพื่อเรียกบริการเว็บระยะไกล (ความรู้พื้นฐานและตัวอย่างง่ายๆ) เราสามารถเขียนย่อหน้าต่อไปนี้:
การเข้ารหัส
< สะพาน namespace = "Dflying" className = "YahooWeatherService">
< ประเภทพร็อกซี = "Microsoft.Web.Services.BridgeRestProxy"
serviceUrl=" http://xml.weather.yahoo.com/forecastrss " />
<ชื่อวิธี = "GetWeather">
<อินพุต>
<ชื่อพารามิเตอร์ = "p" />
<ชื่อพารามิเตอร์ = "u" ค่า = "c" />
ใน:
คุณลักษณะเนมสเปซและ className ของ
คุณลักษณะ serviceUrl ของ
เมธอด GetWeather กำหนดพารามิเตอร์สองตัว p และ u ที่แสดงไว้ด้านบน เราได้ระบุค่าเริ่มต้นของพารามิเตอร์ u เป็น c (แทนองศาเซลเซียส) และผู้เรียกจะส่งผ่านพารามิเตอร์ p
ขั้นตอนนี้เพียงพอแล้ว ไคลเอ็นต์จะได้รับสตริง XML ที่เห็นในเบราว์เซอร์ด้านบน และสามารถประมวลผลและแสดงบนไคลเอ็นต์ได้ แต่การประมวลผล XML ของไคลเอ็นต์นั้นไม่ง่ายหรือมีประสิทธิภาพ และการส่งข้อมูลที่ไม่จำเป็นมากเกินไปผ่านเครือข่ายก็ถือเป็นการสิ้นเปลืองเช่นกัน ดังนั้นที่นี่เราใช้ Transformer ในตัวใน asbx เพื่อประมวลผล XML นี้ แยกเนื้อหาที่เราสนใจ และส่งไปยังไคลเอนต์ในรูปแบบของ JSON เพิ่มย่อหน้าต่อไปนี้ในส่วน
<ข้อมูล>
<ชื่อแอตทริบิวต์ = "ตัวเลือก" ค่า = "ช่อง" />
<ชื่อพจนานุกรม = "namespaceMapping">
<ชื่อรายการ = "yweather" value=" http://xml.weather.yahoo.com/ns/rss/1.0 " />
<ชื่อพจนานุกรม = "selectedNodes">
<ชื่อสินค้า = "ชื่อ" ค่า = "ชื่อ" />
<ชื่อสินค้า = "คำอธิบาย" ค่า = "สินค้า/คำอธิบาย" />
<ชื่อสินค้า="CurrentCondition" value="item/yweather:condition/@text" />
คำสั่ง
name เป็นส่วนแอตทริบิวต์ของตัวเลือก และแอตทริบิวต์ค่าที่ระบุคือนิพจน์ XPath ซึ่งจะเลือกส่วนข้อมูลที่จะใช้โดย XPathBridgeTransformer ทั้งหมด
name เป็นส่วนพจนานุกรมของ namespaceMapping ซึ่งระบุการแมปเนมสเปซในไฟล์ XML นี้ หากเราใช้เนมสเปซบางอย่างในกระบวนการเลือกโหนดต่อไปนี้ การประกาศจะต้องอยู่ที่นี่ ที่นี่เราเพิ่มการแมปลงใน yweather เนื่องจากจะใช้ด้านล่างนี้
name เป็นส่วนพจนานุกรมของ SelectedNodes โดยที่แอตทริบิวต์ value ของแต่ละรายการคือสตริง XPath ซึ่งใช้เพื่อเลือกค่าที่สอดคล้องกันจาก XML และแอตทริบิวต์ name ใช้เพื่อระบุชื่อแอตทริบิวต์ที่สอดคล้องกันใน JavaScript ตามตัวอย่างที่นี่ ฉันได้รับเนื้อหาเพียงสามชิ้น คุณจะเห็นว่ามีการใช้ namespaceMapping ที่ระบุไว้ข้างต้นใน XPath ของ CurrentCondition
ฉันจะไม่ลงรายละเอียดเกี่ยวกับ XPath เพื่อนๆ ที่สนใจหรือไม่คุ้นเคยสามารถ Google ได้ด้วยตัวเอง มีแหล่งข้อมูลออนไลน์มากมาย ฉันไม่ค่อยคุ้นเคยกับ Transformers ประเภทอื่น ฉันจะพูดถึงพวกเขาหากพบพวกเขาในอนาคต ไฟล์ YahooWeatherBridge.asbx ที่เสร็จสมบูรณ์มีลักษณะดังนี้:
< สะพาน namespace = "Dflying" className = "YahooWeatherService">
< ประเภทพร็อกซี = "Microsoft.Web.Services.BridgeRestProxy"
serviceUrl=" http://xml.weather.yahoo.com/forecastrss " />
<ชื่อวิธี = "GetWeather">
<อินพุต>
<ชื่อพารามิเตอร์ = "p" />
<ชื่อพารามิเตอร์ = "u" ค่า = "c" />
<แปลงร่าง>
<ข้อมูล>
<ชื่อแอตทริบิวต์ = "ตัวเลือก" ค่า = "ช่อง" />
<ชื่อพจนานุกรม = "namespaceMapping">
<ชื่อรายการ = "yweather" value=" http://xml.weather.yahoo.com/ns/rss/1.0 " />
<ชื่อพจนานุกรม = "selectedNodes">
<ชื่อสินค้า = "ชื่อ" ค่า = "ชื่อ" />
<ชื่อสินค้า = "คำอธิบาย" ค่า = "สินค้า/คำอธิบาย" />
<ชื่อสินค้า="CurrentCondition" value="item/yweather:condition/@text" />
ตอนนี้สร้างเพจ ASP.NET เพื่อทดสอบ ขั้นแรกยังคงมี ScriptManager ซ้ำนับพันครั้งและการอ้างอิงถึง Bridge:
<บริการ>
จากนั้นจะมีองค์ประกอบ HTML Select ซึ่งแสดงรายการเมืองหลายแห่งและรหัสเมืองที่เกี่ยวข้อง:
ส่วนของ HTML ใช้ในการแสดงผล:
จากนั้นก็มาถึง JavaScript คุณจะเห็นว่า Mashup ถูกเรียกผ่าน Dflying.YahooWeatherService.GetWeather() และค่าที่แปลงแล้วจะถูกส่งออกไปยังเพจหลังจากที่เมธอดส่งคืน: function getWeather_onclick() {
// การควบคุม 'เลือก' ของ Atlas ใหม่
var place = new Sys.UI.Select($('place'));
// เรียกใช้วิธีบริดจ์
Dflying.YahooWeatherService.GetWeather({'p': place.get_selectedValue()}, onGetComplete);
-
ฟังก์ชั่น onGetComplete (ผลลัพธ์) {
$('result').style.display = "บล็อก";
$('title').innerHTML = result[0].Title;
$('คำอธิบาย').innerHTML = ผล[0].คำอธิบาย;
-