移动开发：.NET MAUI使用RESTAPI实现查询天气笔记

在移动开发过程中，第三方对接是非常常见的。今天给大家分享.NET MAUI如何使用REST API实现输入城市名称查询天气的示例，希望对大家学习.NET MAUI可以提供一些帮助！

一、接口准备

首先我们需要找一个查询天气的API接口，这里使用 https://api.vvhan.com/api/weather?city=苏州 API接口进行获取实时天气的json数据，返回示例json如下：

{ "success": true, "city": "北京市", "data": { "date": "2024-08-16", "week": "星期五", "type": "中雨", "low": "24°C", "high": "31°C", "fengxiang": "西北风", "fengli": "1-3级", "night": { "type": "小雨", "fengxiang": "北风", "fengli": "1-3级" } }, "air": { "aqi": 35, "aqi_level": 1, "aqi_name": "优", "co": "1", "no2": "10", "o3": "109", "pm10": "30", "pm2.5": "21", "so2": "3" }, "tip": "现在的温度比较舒适~" }

二、实体部分

通过http请求获取json字符需要转换为实体对象，方便天气结果的拼接展示。首先我们根据接口返回示例创建实体。

新建HttpResponseModel.cs 文件

最外层json数据

public class HttpResponseModel { /// /// 是否成功 true false /// public bool success { get; set; } /// /// 城市 /// public string city { get; set; } /// /// 天气情况实体 /// public Data data { get; set; } /// /// 空气质量 /// public Air air { get; set; } /// /// 提示 /// public string tip { get; set; } }

新建Night.cs 实体文件

定义傍晚预测的天气情况

public class Night { /// /// 晴 /// public string type { get; set; } /// /// 东风 /// public string fengxiang { get; set; } /// /// 1-3级 /// public string fengli { get; set; } }

新建Data.cs 实体文件

定义实时的天气情况

public class Data { /// /// 日期 /// public string date { get; set; } /// /// 星期 /// public string week { get; set; } /// /// 天气 /// public string type { get; set; } /// /// 最低温度 /// public string low { get; set; } /// /// 最高温度 /// public string high { get; set; } /// /// 风向 /// public string fengxiang { get; set; } /// ///风力等级 /// public string fengli { get; set; } /// /// /// public Night night { get; set; } }

新建Air.cs 实体文件

定义空气质量实体

/// /// 空气质量 /// public class Air { /// /// /// public int aqi { get; set; } /// /// /// public int aqi_level { get; set; } /// /// 优 /// public string aqi_name { get; set; } /// /// /// public string co { get; set; } /// /// /// public string no2 { get; set; } /// /// /// public string o3 { get; set; } /// /// /// public string pm10 { get; set; } /// /// /// public string so2 { get; set; } }

三、页面部分

创建APP页面APIDemo.xaml，这里为了方便演示，创建一个Label用来展示查询的天气结果、一个输入框用来输入城市名称、一个查询按钮用来实现查询动作。

页面代码如下：

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

四、后台代码逻辑

APIDemo.xaml 页面的后台代码文件编写http请求函数和按钮事件绑定查询结果。这里使用官方自带的HttpClient请求类库和Json解析工具进行操作。

代码如下：

/// /// 发起http请求获取天气json数据 /// /// public async Task GetHttp() { var result = new HttpResponseModel(); HttpClient _client=new HttpClient(); string str = entry.Text; var options = new JsonSerializerOptions { NumberHandling = JsonNumberHandling.AllowReadingFromString | JsonNumberHandling.WriteAsString }; Uri uri = new Uri(string.Format(url+ "?city="+str, string.Empty)); try { HttpResponseMessage response = await _client.GetAsync(uri); if (response.IsSuccessStatusCode) { string content = await response.Content.ReadAsStringAsync(); result = JsonSerializer.Deserialize(content, options); } } catch (Exception ex) { Debug.WriteLine(@"tERROR {0}", ex.Message); } return result; } /// /// 查询天气按钮事件 /// /// /// private async void OnWeatherClicked(object sender, EventArgs e) { var result = await GetHttp(); if (result.success) { StringBuilder sb=new StringBuilder(); sb.AppendLine("城市；"+result.city); sb.AppendLine("日期；"+result.data.date); sb.AppendLine("星期；" + result.data.week); sb.AppendLine("天气：" + result.data.type); string res=sb.ToString(); Label1.Text = sb.ToString(); } }

运行效果