C语言实现天气获取 + HTML页面

目录

一、聚合 API

二、天气客户端实现的要点

1、请求Key

2、GET请求

3、天气服务端返回的数据

三、Ubuntu Linux下安装apache2(web服务)

配置环境：

四、HTML基础

1、搭建HTML框架

---

一、聚合 API

聚合API注册

实名注册账号，实名认证时需要上传身份证正反面，大概3个工作日认证成功，实名认证后，免费接口可以使用100次/天

使用接口前确保Ubuntu可以正常上网

二、天气客户端实现的要点

1、请求Key

天气预报API  

我们完成这个实验必须得到这个上面去注册一个账号才能使用聚合API的天气数据，注册之后每个账户都会有一个Key，例如：

请求Key：ef7755d80707f9258a95a000f8c6xxxx

2、GET请求

HTTP有几种请求方法，我们这里使用的是GET请求。查看聚合天气API文档可知，请求地址示例为：

请求示例：http://apis.juhe.cn/simpleWeather/query?city=%E8%8B%8F%E5%B7%9E&key=

这是一个天气实况的请求地址示例，其有几个重要的参数：

	名称	必填	类型	说明
	city	是	string	要查询的城市名称/id，城市名称如：温州、上海、北京，需要utf8 urlencode
	key	是	string	在个人中心->我的数据,接口名称上方查看

 

这里的Key是个很重要的参数，就是我们前面说的。

我们的天气客户端就是要往天气服务端发送类似这样的GET请求来获取天气数据，具体的请求方法示例为：

GET http://apis.juhe.cn/simpleWeather/query?city=北京&key=ef7755d80707f9258a95a000f8c6xxxx

linux模拟http请求命令

sprintf函数的用法：

（1）函数功能：字符串格式化

（2）函数原型：int sprintf(char *string, char *format [,argument,…]);

string： 这是指向一个字符数组的指针，该数组存储了 C 字符串。

format ： 这是字符串，包含了要被写入到字符串 str 的文本。

[argument]….：根据不同的 format 字符串，函数可能需要一系列的附加参数，每个参数包含了一个要被插入的值，替换了 format 参数中指定的每个 % 标签。

使用示例：

sprintf(buf, "%s,%d", str, num);

假如此时str为"hello"，num为5201314，则此时buf中的内容为：hello，5201314，需要注意的是buf的容量要足够大。

3、天气服务端返回的数据

天气服务端给我们天气客户端返回的数据为JSON格式数据

 

三、Ubuntu Linux下安装apache2(web服务)

Apache或Apache HTTP服务器是一个免费的开源Web服务器，由Apache软件基金(Apache Software Foundation)开发和维护。

sudo  su
sudo  apt  update
sudo  apt-get  install  apache2

此时浏览器访问ubuntu ip地址应该会有默认页面，查看ip地址的命令：ifconfig

如果想要将默认页面修改为我们自己的页面需要进行环境配置

配置环境：

apache2配置文件

链接：https://pan.baidu.com/s/1P3-1vtUSsMY26bmQtgH1ew 
提取码：8krk 
 

cd  /work
mkdir web

把apache2.conf,  mime.load, serve-cgi-bin.conf, 000-default.conf拷贝到/work/web/下

在Ubuntu的文件内切换到/work/web的界面，从Windows复制四个文件，粘贴到该目录下：(具体目录根据个人)

切换到终端

cd  /work/web/

cp  apache2.conf  /etc/apache2/  -rf

cp  000-default.conf  /etc/apache2/sites-enabled/  -rf

cp   mime.load   /etc/apache2/mods-enabled/  -rf

cp   serve-cgi-bin.conf   /etc/apache2/conf-enabled/  -rf

重启服务

sudo  /etc/init.d/apache2  restart

创建hello.html文件拷贝到/work/web/html下

mkdir  html
mkdir cgi-bin

hello.html

    
    
    
    


    
你们好！

每次添加文件需要进行一次权限操作

chmod  777 /work/web  -R

使用浏览器访问ubuntu ip地址，显示“你们好！”代表正确：

四、HTML基础

1、搭建HTML框架

Index.html 页面入口

Top.html 项目标题

Left.html 项目菜单

Weather.html 天气页面

在web目录下，cgi-bin是后端处理代码

这里推荐一个国外HTML页面模板网址：HTML页面

以及图标素材网址：图标素材

2、编写天气处理代码

apiWeather.c

#include 
#include 
#include 
#include

#include "include.h"

//!!!使用时请换成自己的KEY
#define API_KEY "xxxxxxxxx"

//请求对应城市的天气
int apiWeather(char *cityName);


int main(int argc, char *argv[])
{
 
    if (argc != 2)
    {
        printf("使用方法: ./apiWeather 城市名称\n");
        return 0;
    }

    apiWeather(argv[1]);
    //printf("city :%s\n", argv[1]);

    return 0;
}

int apiWeather(char *cityName)
{
    char cmd[MAX_LEN] = {0};
    char result[RESULT_BUF_LEN] = {0};
    //生成API请求url
    sprintf(cmd, "curl -s \"http://apis.juhe.cn/simpleWeather/query?city=%s&key=%s\"", cityName, API_KEY);

    popenCmd(cmd, result);
    printf("%s\n", result);

    return 0;
}

tools.c

#include 
#include 
#include "include.h"

//执行命令,将命令结果保存到result
int popenCmd(char *cmd, char *result)
{
    FILE *fp = popen(cmd, "r");
    if (NULL == fp)
    {
        printf("打开 file命令失败\n");
        goto err;
    }

    //将结果读取到results字符串数组中
    fgets(result, RESULT_BUF_LEN, fp);
    if (fp)
    {
        pclose(fp);
        fp = NULL;
    }

    return 0;

err:

    if (fp)
    {
        pclose(fp);
        fp = NULL;
    }

    return -1;
}

include.h

#include "cJSON.h"

#define MAX_LEN 256
#define RESULT_BUF_LEN 102400


//执行命令,将命令结果保存到result
int popenCmd(char *cmd, char *result);

编译命令

gcc -o apiWeather apiWeather.c tools.c -lm

cgi-bin目录下citycode.cgi在执行apiWeather程序时，需要将weather放到和citycode.cgi同一个目录下。

citycode.cgi

#!/bin/sh

echo "Conten-type:text/html;Cache-Control:no-cache;charset=utf-8\\n\\r\\n\\r"
city=`echo $QUERY_STRING  |awk -F '[=]' '{print $2}'`

./apiWeather $city

最终实现结果为：

HTML源代码：
链接：https://pan.baidu.com/s/1baNfUCJi4pnIDmWacLBWBA 
提取码：7vy0 
 

如有错误请提出！