ハシウェブ

Web制作、プログラミングに関する情報を発信するブログ

PHPで天気を取得、表示させたい!OpenWeatherMap APIの使い方

PHPで天気を取得、表示させたい!OpenWeatherMap APIの使い方

「Webサイトに天気を表示させたい」
「OpenWeatherMapの使い方がわからない」

悩み

こういった悩みにお答えします。

  • PHPで天気を表示させられるようになります。
  • WordPressでも使用できます。
  • 応用次第ではアプリ等にも転用できます。

この記事ではこんなことがわかります。

目次
  1. OpenWeatherMap とは
  2. APIキーを取得する
    1. アカウント登録ページへアクセスする
    2. 必要事項を入力する
    3. 使用目的を入力する
    4. 確認メールが届く
    5. 登録完了
  3. PHPを使ってリクエストする
    1. OpenWeatherMap APIを呼び出す
    2. 天気と温度を取得、表示させる
  4. まとめ

OpenWeatherMap とは

OpenWeatherMapは、現在の天気や天気予報などの無料APIを提供するオンラインサービスです。

Сurrent weather and forecast - OpenWeatherMap

Get current weather, hourly forecast, daily forecast for 16 days, and 3-hourly forecast 5 days for your city. Historical weather data for 40 years back for any coordinate. Helpful stats, graphics, and this day in history charts are available for your reference. Interactive maps show precipitation, clouds, pressure, wind around your location.

アカウントを登録し、API Keyを取得するだけで、フリープランを使うことができ、以下のサービスがうけられます。
ほとんどの場合は、フリープランで十分だと思います。

  • 現在の天気
  • 1時間までの分予報
  • 2日後までの時間予報
  • 7日後までの予報
  • 過去5日の天気

APIキーを取得する

5日後までの天気予報は無料プランで取得できるので、まずアカウント作成していきます。

アカウント登録ページへアクセスする

OpenWeatherへアクセスし、ヘッダーの「Sign Up」をクリックします

OpenWeather

必要事項を入力する

  1. ①「Username」「Enter email」「Password」「Repeat Password」を入力します。
  2. ②年齢(16歳以上)確認、「プライバシーポリシーの同意」をチェックします。
  3. ③「OpenWeather」からのニュース等3項目を受け取るかどうかなので、チェック不要です。
  4. ④キャプチャをチェックします。
  5. ⑤「Create Account」をクリックします。
OpenWeather

使用目的を入力する

  1. ①会社名を入力します。
  2. ②使用目的を選択します。おそらく、なんでも大丈夫だと思います。
OpenWeather

確認メールが届く

着信した確認メールの「Verify your email」をクリックします。

確認メール

登録完了

着信した登録完了メールにAPIキーがあります。
これで完了です。

登録完了メール

マイページのAPI Keysからも「APIキー」を確認できます。

PHPを使ってリクエストする

OpenWeatherMap APIを呼び出す

以下のURLからJSON形式の天気情報が取得することができます。


  //天気を取得したい都市 例:岐阜市
  $city = "Gifu-shi,jp";

  //アカウント登録で取得したAPI Key
  $appid = "●●●●●●●●●●";

  //以下のURLからJSON形式で現在の天気情報を取得
  $url = "http://api.openweathermap.org/data/2.5/weather?q=" . $city . "&units=metric&APPID=" . $appid;

取得した天気情報 → OpenWeatherデモ

POINT
「units=metric」で摂氏温度(℃)の取得ができます。
これがないと絶対温度(K)になるので、取得した数値から「-273.15」する必要があります。

天気と温度を取得、表示させる

天気と温度を取得、表示させる関数にします。
WordPressであれば、functions.phpにこのコードをコピペします。

POINT
取得する情報はすべて英語なので、日本語にするには翻訳が必要です。

function get_json( $type = null ){
  $city = "Gifu-shi,jp";
  $appid = "●●●●●●●●●●";
  $url = "http://api.openweathermap.org/data/2.5/weather?q=" . $city . "&units=metric&APPID=" . $appid;

  $json = file_get_contents( $url );
  $json = mb_convert_encoding( $json, 'UTF8', 'ASCII,JIS,UTF-8,EUC-JP,SJIS-WIN' );
  $json_decode = json_decode( $json );

  //現在の天気
  if( $type  === "weather" ):
    $out = $json_decode->weather[0]->main;

  //現在の天気アイコン
  elseif( $type === "icon" ):
    $out = "<img src='https://openweathermap.org/img/wn/" . $json_decode->weather[0]->icon . "@2x.png'>";

  //現在の気温
  elseif( $type  === "temp" ):
    $out = $json_decode->main->temp;

  //パラメータがないときは配列を出力
  else:
    $out = $json_decode;

  endif;

  return $out;
}

表示させたい場所に以下のコードをコピペします。
今回はtableタグにしていますが、実際には好きなタグで表示させてください。

<table border>
  <tr>
    <th>天気</th>
    <th>気温</th>
  </tr>
  <tr>
    <th>
      <?php echo get_json("icon"); ?>
      <?php echo get_json("weather"); ?>
    </th>
    <th><?php echo get_json("temp"); ?>℃</th>
  </tr>
</table>
OpenWeatherデモ

まとめ

OpenWeatherMap APIを使って天気を取得、表示する手順を解説しました。

PHPの知識があれば、比較的簡単に取得、表示できると思います。
ちょっとしたWebアプリなんかにも応用していけると思います。