.net请求Webservice简单实现天气预报功能
很久没有接触Webservice的知识,今天稍微复习了一下关于webservice,简单做了一个天气预报的功能,虽然界面丑的厉害,但功能算是实现了,以下是效果展示。
这东西没什么难点,只是天气预报的功能在网站类的开发中会经常用到,所以就简单写下,以便以后查阅。
1.新建一个网站或者web应用程序,添加一个aspx页面,用于展示天气数据。(这个应该不用细讲吧)
2.在网上找一个免费的天气预报的接口,我用的是Webxml网站的,地址如下:
http://webservice.webxml.com.cn/WebServices/WeatherWS.asmx
3.在项目目录下, 引用 — 添加服务引用,弹出对话框,然后输入接口地址,点击前往,命名空间可以改成你想要的,如下图:
4.确定,至此,天气接口服务就已经完成了,接下来就是Coding了。
部分前台js界面代码:
//省份 function LoadProvince() { $.ajax({ type: "POST", url: "ashx/weatherHandler.ashx", data: "option=province", success: function (result) { $(".sel-province option").remove(); var arry = result.split(‘|‘); var obj = null; for (var i = 0; i < arry.length; i++) { if (arry[i] != null && arry[i] != "") { obj = arry[i].split(‘,‘); $(".sel-province").append("<option value=‘" + obj[1] + "‘>" + obj[0] + "</option>"); } } $(".sel-province").find("option[text=‘北京‘]").attr("selected", "selected"); }, error: function (errorMsg) { $(".result-table tr").remove(); $(".result-table").append("<tr><td>省份请求出现错误,请您稍后重试。。。</td></tr>"); } }); } //城市 function LoadCity(provinceid) { $.ajax({ type: "POST", url: "ashx/weatherHandler.ashx", data: "provinceid=" + provinceid + "&option=city", success: function (result) { $(".sel-city option").remove(); var arry = result.split(‘|‘); var obj = null; for (var i = 0; i < arry.length; i++) { if (arry[i] != null && arry[i] != "") { obj = arry[i].split(‘,‘); $(".sel-city").append("<option value=‘" + obj[1] + "‘>" + obj[0] + "</option>"); } } }, error: function (errorMsg) { $(".result-table tr").remove(); $(".result-table").append("<tr><td>城市请求出现错误,请您稍后重试。。。</td></tr>"); } }); } //加载天气 function GetWeather(cityid) { $.ajax({ type: "POST", url: "ashx/weatherHandler.ashx", data: "cityid=" + cityid + "&option=weather", success: function (result) { $(".result-table tr").remove(); var arry = result.split(‘|‘); var obj = null; for (var i = 0; i < arry.length; i++) { if (arry[i] != null && arry[i] != "") { if (arry[i].indexOf(".gif") > 0) { $(".result-table").append("<tr><td><image src=‘images/" + arry[i] + "‘/></td></tr>"); } else { $(".result-table").append("<tr><td>" + arry[i] + "</td></tr>"); } } } }, error: function (errorMsg) { $(".result-table tr").remove(); $(".result-table").append("<tr><td>天气数据请求出现错误,请您稍后重试。。。</td></tr>"); } }); }
html代码:
<body> <form id="form1" runat="server"> <div class="head-div"> <table> <tr> <td> <select class="sel-province sel"> </select> </td> <td> <select class="sel-city sel"> </select> </td> <td> <input type="button" class="btn-search" value="查询" /> </td> </tr> </table> </div> <div class="result-div"> <table class="result-table"> </table> </div> </form> </body>
由于js不支持跨域,要不当初直接ajax请求天气接口就完事了,现在处理方式是:ajax+ashx一般处理程序(在里面调用天气接口)。
一般处理程序代码如下:
using System.Web; using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Text; namespace WeatherTest.ashx { /// <summary> /// weatherHandler 的摘要说明 /// </summary> public class weatherHandler : IHttpHandler { WeatherWsClient.WeatherWSSoapClient client = new WeatherWsClient.WeatherWSSoapClient(); public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; string[] result = null; string option = context.Request.Form["option"]; switch (option) { case "province": result = GetProvinces(); break; case "city": result = GetCitys(context.Request.Form["provinceid"]); break; case "weather": result = GetWeather(context.Request.Form["cityid"], null); break; } string str = ConvertToString(result, option); context.Response.Write(str); } /// <summary> /// 数组转字符串 /// </summary> /// <param name="result"></param> /// <param name="option"></param> /// <returns></returns> private string ConvertToString(string[] result, string option) { StringBuilder sb = new StringBuilder(); foreach (string item in result) { sb.Append(item+"|"); } return sb.ToString(); } /// <summary> /// 省份 /// </summary> /// <returns></returns> private string[] GetProvinces() { return client.getRegionProvince(); } /// <summary> /// 城市 /// </summary> /// <param name="provinceid"></param> /// <returns></returns> private string[] GetCitys(string provinceid) { return client.getSupportCityString(provinceid); } /// <summary> /// 天气数据 /// </summary> /// <param name="cityid"></param> /// <param name="userid"></param> /// <returns></returns> private string[] GetWeather(string cityid, string userid) { return client.getWeather(cityid, userid); } public bool IsReusable { get { return false; } } } }
至此,前后台代码就已经完毕了,顺便说句,由于写的比较简单,路过的大神不喜勿喷,谢谢。
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。