PHP は天気 API を使用して天気情報を取得します-PHPチュートリアル-php.cn

PHP は天気 API を使用して天気情報を取得します

??? China Weather Network はいくつかの気象クエリ API を提供しており、アクセスすると気象情報の JSON 形式のデータが返され、解析することで気象情報を取得できます。

http://www.weather.com.cn/data/sk/101281601.html

http://www.weather.com.cn/data/cityinfo/101281601.html
http:/ /m.weather.com.cn/data/101281601.html

次の数字は市外局番です。

?返された utf-8 文字列

{"weatherinfo":{"city":"东莞","cityid":"101281601","temp":"22","WD":"东风","WS":"1级","SD":"90%","WSE":"1","time":"08:20","isRadar":"0","Radar":""}}

ログイン後にコピー

では、まず都市名を都市コードに変換する必要があります。最も簡単な方法は、

というテキストファイルを読み取ることです。

形式:

101010100=北京 
101010200=海淀
101010300=朝阳
101010400=顺义
101010500=怀柔
101010600=通州
101010700=昌平
101010800=延庆
101010900=丰台
101011000=石景山
101011100=大兴

ログイン後にコピー

テキストファイルと PHP ファイルは同じディレクトリに配置されます。

PHP コード:

?実行結果:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
	<head>
		<meta http-equiv="content-type" content="text/html; charset=utf-8" />
		<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
		<script src="http://libs.baidu.com/bootstrap/2.0.4/js/bootstrap.min.js"></script>
		<link href="http://libs.baidu.com/bootstrap/2.0.4/css/bootstrap.min.css" rel="stylesheet"/>
		<title>天气查询简单版</title>
	</head>
	<body>
		<form class="form-horizontal" action="" method="post">
			<legend>
				Weather
			</legend>
			<div class="control-group">
				<label class="control-label" for="idCity">城市：</label>
				<div class="controls">
					<input name="city" type="text" name="city" id="idCity" placeholder="请输入城市名字" maxlength="64">
				</div>
			</div>
			<div class="control-group">
				<div class="controls">
					<button type="submit" class="btn btn-primary" style="margin: 10px">
						确定
					</button>
					<button type="reset" class="btn btn-inverse" style="margin: 10px">
						重置
					</button>
				</div>
			</div>
		</form>
		<hr/>
		<?php
		header("Content-Type: text/html; charset=utf-8");
		function getWeather($city) {
			$wcity = file_get_contents("wcity.txt");
			$pattern = '/([0-9]+)=' . $city . '/';
			preg_match($pattern, $wcity, $matches, PREG_OFFSET_CAPTURE);
			if ($matches == null) {
				return null;
			}
			$cityID = $matches[1][0];
			$data = file_get_contents('http://www.weather.com.cn/data/sk/' . $cityID . '.html');
			return json_decode($data, true);
		}

		if ($_POST != null && $_POST["city"] != null) {
			$weather = getWeather($_POST["city"]);
			if ($weather == null) {?>
			<div class="alert alert-block" style="margin: 20px">
				<button type="button" class="close" data-dismiss="alert">
					&times;
				</button>
				<h4>警告!</h4>
				发生错误了亲，您输入的城市好像没有找到哦！
			</div>
			<?php return;
			}
			$info = $weather["weatherinfo"];
			?>
			<table class="table table-striped table-bordered" style="margin-left: 20px;width: 200px">
				<thead>
					<th>实时天气信息</th>
				</thead>
				<tbody>
			<?php
			echo "<tr><td>城市：</td><td>".$info["city"]."</td></tr>";
			echo "<tr><td>城市ID：</td><td>".$info["cityid"]."</td></tr>";
			echo "<tr><td>气温：</td><td>".$info["temp"]."℃</td></tr>";
			echo "<tr><td>风向：</td><td>".$info["WD"]."</td></tr>";
			echo "<tr><td>风力：</td><td>".$info["WS"]."</td></tr>";
			echo "<tr><td>湿度：</td><td>".$info["SD"]."</td></tr>";
			echo "<tr><td>更新时间：</td><td>".$info["time"]."</td></tr>";
			?>								
				</tbody>
			</table>
			<?php
		}
		?>
	</body>
</html>

ログイン後にコピー

方法 2:

1. ファイルを使用する代わりに、Weather Network サーバーから都市名と ID を動的に取得できます。

このアドレスにアクセスした場合

http://m.weather.com.cn/data5/city.xml?

サーバーは次のコードを返します:

2. この時点で、州コードがわかります。このようにして、州コードを知ることが最初のステップになります。ユーザーが選択するためのドロップダウンボックスを作成することもできます:

01|北京,02|上海,03|天津,04|重庆,05|黑龙江,06|吉林,07|辽宁,08|内蒙古,09|河北,10|山西,11|陕西,12|山东,13|新疆,14|西藏,15|青海,16|甘肃,17|宁夏,18|河南,19|江苏,20|湖北,21|浙江,22|安徽,23|福建,24|江西,25|湖南,26|贵州,27|四川,28|广东,29|云南,30|广西,31|海南,32|香港,33|澳门,34|台湾

ログイン後にコピー

省を知った後、この省にどのような都市があるのかを確認する必要があります。たとえば、雲南省は 05 です。すべての州と都市に関する情報を取得したい場合。雲南省では、次の場所を訪れる必要があります:

http://m.weather.com.cn/data5/city29.xml? 返信テキスト:

?3. ただし、これでは十分ではありません。たとえば、大理県にある県レベルの都市と県を知りたい場合は、次の訪問を続ける必要があります。

2901|昆明,2902|大理,2903|红河,2904|曲靖,2905|保山,2906|文山,2907|玉溪,2908|楚雄,2909|普洱,2910|昭通,2911|临沧,2912|怒江,2913|迪庆,2914|丽江,2915|德宏,2916|西双版纳

ログイン後にコピー

http://m.weather.com.cn/data5/city2902.xml 案の定、次の結果が返されました:

?4. この時点ですべての都市名が見つかりましたが、このコードは最終的な都市コードではないため、ビン川のコードを再度見つける必要があります:

290201|大理,290202|云龙,290203|漾濞,290204|永平,290205|宾川,290206|弥渡,290207|祥云,290208|巍山,290209|剑川,290210|洱源,290211|鹤庆,290212|南涧

ログイン後にコピー

http://m.weather.com.cn/data5/city290205.xml ? ?これまでに4回読み込んで都市名と都市コードを取得しました。

290205|101290205

ログイン後にコピー

もちろん、データの解析は Javascript を使用して行うこともできますが、Ajax はクロスドメイン名アクセスをサポートしていないため、China Weather Network サーバーからローカルにデータを取得するには、その機能として単純なサーバースクリプトが必要です。要求されたファイルを動的データ表示用の文字列として Javascript に返すだけです:

まず、文字列を読み取る PHP を作成します

getstr.php

?Ajax を使用した js ファイル:

<?php
echo file_get_contents($_GET['url']);
?>

ログイン後にコピー

ajax.js

?ウェブページのパーツコード:

function Ajax(recvType) {
  var aj = new Object();
  aj.recvType = recvType ? recvType.toUpperCase() : 'HTML'//HTML XML
  aj.targetUrl = '';
  aj.sendString = '';
  aj.resultHandle = null;

  aj.createXMLHttpRequest = function() {
    var request = false;
    //window对象中有XMLHttpRequest存在就是非IE，包括（IE7，IE8）
    if (window.XMLHttpRequest) {
      request = new XMLHttpRequest();
      if (request.overrideMimeType) {
        request.overrideMimeType("text/xml");
      }
      //window对象中有ActiveXObject属性存在就是IE
    } else if (window.ActiveXObject) {
      var versions = ['Microsoft.XMLHTTP', 'MSXML.XMLHTTP', 'Msxml2.XMLHTTP.7.0', 'Msxml2.XMLHTTP.6.0', 'Msxml2.XMLHTTP.5.0', 'Msxml2.XMLHTTP.4.0', 'MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP'];
      for (var i = 0; i < versions.length; i++) {
        try {
          request = new ActiveXObject(versions[i]);
          if (request) {
            return request;
          }
        } catch(e) {
          request = false;
        }
      }
    }
    return request;
  }

  aj.XMLHttpRequest = aj.createXMLHttpRequest();

  aj.processHandle = function() {
    if (aj.XMLHttpRequest.readyState == 4) {
      if (aj.XMLHttpRequest.status == 200) {
        if (aj.recvType == "HTML")
          aj.resultHandle(aj.XMLHttpRequest.responseText);
        else if (aj.recvType == "XML")
          aj.resultHandle(aj.XMLHttpRequest.responseXML);
      }
    }
  }

  aj.get = function(targetUrl, resultHandle) {
    aj.targetUrl = targetUrl;

    if (resultHandle != null) {
      aj.XMLHttpRequest.onreadystatechange = aj.processHandle;
      aj.resultHandle = resultHandle;
    }
    if (window.XMLHttpRequest) {
      aj.XMLHttpRequest.open("get", aj.targetUrl);
      aj.XMLHttpRequest.send(null);
    } else {
      aj.XMLHttpRequest.open("get", aj.targetUrl, true);
      aj.XMLHttpRequest.send();
    }

  }

  aj.post = function(targetUrl, sendString, resultHandle) {
    aj.targetUrl = targetUrl;

    if ( typeof (sendString) == "object") {
      var str = "";
      for (var pro in sendString) {
        str += pro + "=" + sendString[pro] + "&";
      }
      aj.sendString = str.substr(0, str.length - 1);
    } else {
      aj.sendString = sendString;
    }

    if (resultHandle != null) {
      aj.XMLHttpRequest.onreadystatechange = aj.processHandle;
      aj.resultHandle = resultHandle;
    }

    aj.XMLHttpRequest.open("post", targetUrl);
    aj.XMLHttpRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    aj.XMLHttpRequest.send(aj.sendString);

  }

  return aj;
}

ログイン後にコピー

?実行結果:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
    <script src="http://libs.baidu.com/bootstrap/2.0.4/js/bootstrap.min.js"></script>
    <link href="http://libs.baidu.com/bootstrap/2.0.4/css/bootstrap.min.css" rel="stylesheet"/>
    <title>实时气温信息</title>
    <script type="text/javascript" src="./ajax.js"></script>
    <script type="text/javascript">
      function str2Array(data) {
        data = data.replace(/\|/g, "\":\"");
        data = data.replace(/,/g, "\",\"");
        data = '({\"' + data + '\"})';
        return eval(data);
      }

      function getProvince() {
        var ajax = Ajax();
        ajax.get("getstr.php?url=http://m.weather.com.cn/data5/city.xml", function(data) {
          var arr = str2Array(data);
          var prov = document.getElementById("province");
          for (var p in arr) {
            prov.options.add(new Option(arr[p], p));
          }
          prov.options.selectedIndex = 0;
          getCity(prov.value);
        });
      }

      function getCity(provId) {
        var ajax = Ajax();
        ajax.get("getstr.php?url=http://m.weather.com.cn/data5/city" + provId + ".xml", function(data) {
          var arr = str2Array(data);
          var city = document.getElementById("city");
          for (var i = city.options.length; i >= 0; i--) {
            city.remove(i);
          }
          for (var p in arr) {
            city.options.add(new Option(arr[p], p));
          }
          getTown(city.value);
        });
      }

      function getTown(provId) {
        var ajax = Ajax();
        ajax.get("getstr.php?url=http://m.weather.com.cn/data5/city" + provId + ".xml", function(data) {
          var arr = str2Array(data);
          var town = document.getElementById("town");
          for (var i = town.options.length; i >= 0; i--) {
            town.remove(i);
          }
          for (var p in arr) {
            town.options.add(new Option(arr[p], p));
          }
          getCityId();
        });
      }

      function getCityId() {
        var ajax = Ajax();
        var index = document.getElementById("town").value;
        ajax.get("getstr.php?url=http://m.weather.com.cn/data5/city" + index + ".xml", function(data) {
          var arr = str2Array(data);
          cityId = arr[index];
          showWeather(cityId);
        });
      }

      function insertTab(tab, cel1, cel2) {
        var newRow = tab.insertRow(tab.rows.length);
        var cell = newRow.insertCell(0);
        cell.innerHTML = cel1;
        var cell = newRow.insertCell(1);
        cell.innerHTML = cel2;
      }

      function showWeather(cityId) {
        if (cityId == null) {
          return;
        }
        var ajax = Ajax();
        ajax.get("getstr.php?url=http://www.weather.com.cn/data/sk/" + cityId + ".html", function(data) {
          data = '(' + data + ')';
          var info = eval(data)["weatherinfo"];
          var tab = document.getElementById("weather");

          var len = tab.rows.length;
          while(len-- > 0){
            tab.deleteRow(len);
          }

          insertTab(tab, "城市：", info["city"]);
          insertTab(tab, "城市ID：", info["cityid"]);
          insertTab(tab, "气温：", info["temp"] + "℃");
          insertTab(tab, "风向：", info["WD"]);
          insertTab(tab, "风力：", info["WS"]);
          insertTab(tab, "湿度：", info["SD"]);
          insertTab(tab, "更新时间：", info["time"]);
        });
      }

      getProvince();
    </script>
    <style type="text/css">
        select {
            width: 100px;
        }
    </style>
  </head>
  <body>
    <div style="margin: 20px">
      <legend>
        Weather
      </legend>
      <br>
      <select id="province" onchange="getCity(this.value)" ></select>
      <select id="city" onchange="getTown(this.value)" ></select>
      <select id="town" onchange="getCityId()" ></select>
      <br>
      <table id="weather" class="table table-striped table-bordered" style="width: 310px"></table>
    </div>
  </body>
</html>

ログイン後にコピー