很久没有接触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;
}
}
}
}

 至此,前后台代码就已经完毕了,顺便说句,由于写的比较简单,路过的大神不喜勿喷,谢谢。

.net请求Webservice简单实现天气预报功能的更多相关文章

  1. 【AS3 Coder】任务七:初涉PureMVC——天气预报功能实现

    转自:http://www.iamsevent.com/post/36.html AS3 Coder]任务七:初涉PureMVC——天气预报功能实现 使用框架:AS3任务描述:了解PureMVC框架使 ...

  2. Unity3d请求webservice

    我们在对接第三方sdk时,第三方sdk通常会以一个webservice接口的形式供我们来调用.而这些接口会以提供我们get,post,soap等协议来进行访问.get,post方法相信大家都比较熟悉了 ...

  3. ASP.NET MVC 学习4、Controller中添加SearchIndex页面,实现简单的查询功能

    参考:http://www.asp.net/mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/examining-the-edit-method ...

  4. Web---创建Servlet的3种方式、简单的用户注册功能

    说明: 创建Servlet的方式,在上篇博客中,已经用了方式1(实现Servlet接口),接下来本节讲的是另外2种方式. 上篇博客地址:http://blog.csdn.net/qq_26525215 ...

  5. Ajax实现天气预报功能

    实现天气预报功能 闲来无聊,写下此文 经常看见很多网站上有那种天气预报功能,自己之前也写过一个,不过属于那种涉及WCF服务引用那种,今天发现一个更为简单的方式来实现,使用Javascript和Ajax ...

  6. Spring 学习——基于Spring WebSocket 和STOMP实现简单的聊天功能

    本篇主要讲解如何使用Spring websocket 和STOMP搭建一个简单的聊天功能项目,里面使用到的技术,如websocket和STOMP等会简单介绍,不会太深,如果对相关介绍不是很了解的,请自 ...

  7. Django文件上传三种方式以及简单预览功能

    主要内容: 一.文件长传的三种方式 二.简单预览功能实现 一.form表单上传 1.页面代码 <!DOCTYPE html> <html lang="en"> ...

  8. 使用 CXF 做 webservice 简单例子(转载)

    使用 CXF 做 webservice 简单例子     Apache CXF 是一个开放源代码框架,提供了用于方便地构建和开发 Web 服务的可靠基础架构.它允许创建高性能和可扩展的服务,您可以将这 ...

  9. webserive学习记录6-页面请求webservice

    前面都是通过JAVA代码访问webservice服务,下面将介绍通过javascript,jquery访问webservice服务并介绍过过servlet解决跨域问题的方法. 服务端 编写服务代码,解 ...

随机推荐

  1. Spring4:JDBC

    数据库连接池 对一个简单的数据库应用,由于对数据库的访问不是很频繁,这时可以简单地在需要访问数据库时,就新创建一个连接,就完后就关闭它,这样做也不会带来什么性能上的开销.但是对于一个复杂的数据库应用, ...

  2. Ubuntu Desktop开发生产环境搭建

    Ubuntu Desktop开发生产环境搭建 1   开发生产环境搭建 在本节内容开始前,先定义一下使用场合,没有哪种系统或者设备是万能的,都有它的优点和缺点,能够在具体的使用场景,根据自身的需求来取 ...

  3. Java多线程系列--“JUC锁”09之 CountDownLatch原理和示例

    概要 前面对"独占锁"和"共享锁"有了个大致的了解:本章,我们对CountDownLatch进行学习.和ReadWriteLock.ReadLock一样,Cou ...

  4. html嵌套MP4、PDF的简单方案

    你需要一个jquery.media插件,http://malsup.com/jquery/media/ 然后: <html><head><script src=" ...

  5. onSingleTapUp()和onSingleTapConfirmed()的区别

    onSingleTapUp() - 在按下并抬起时发生,只要符合这个条件就触发该函数,没有任何附加条件. onSingleTapConfirmed() 同上者,但有附加条件,就是Android会确保单 ...

  6. 我的ef连接mysql之旅

      摘要: install-package ef6,mysql.data:增加provider invariantName="MySql.Data.MySqlClient" typ ...

  7. JS动态设置css的几种方式

    1. 直接设置style的属性  某些情况用这个设置 !important值无效 如果属性有'-'号,就写成驼峰的形式(如textAlign)  如果想保留 - 号,就中括号的形式  element. ...

  8. [Maven]Eclipse插件之Maven配置及问题解析.

    前言:今天在自己环境装了Maven环境, 并且安装了Eclipse插件, 在查找插件过程中确实遇到一些问题, 好不容易找到一个  却又有问题.装好了插件之后, 用Eclipse创建Maven项目却出现 ...

  9. iOS开发——高级技术精选OC篇&Runtime之字典转模型实战

    Runtime之字典转模型实战 如果您还不知道什么是runtime,那么请先看看这几篇文章: http://www.cnblogs.com/iCocos/p/4734687.html http://w ...

  10. KnockoutJS 3.X API 第二章 数据监控(1)视图模型与监控

    数据监控 KO的三个内置核心功能: 监控(Observable)和依赖性跟踪(dependency tracking) 声明绑定(Declarative bindings) 模板(Templating ...