RESAS APIを使ってみる(1)

※ 本記事はGoogle Chromeの利用を前提とします。

1. RESAS APIの登録

RESAS APIの登録を行いましょう。

https://opendata.resas-portal.go.jp/

※マイページから「利用規約の確認」を実施しないとAPIにアクセスした際に403 Forbiddenでエラーになるので注意。

登録が完了し、利用規約の確認をすることでAPI-KEYが発行されAPIが使えるようになります。

2. RESAS APIの仕様書

APIの仕様書を確認しましょう。

https://opendata.resas-portal.go.jp/docs/api/v1/index.html

※ネットの記事で/v1-rc.1/でアクセスしている記事が散見されますが、2017年1月22日時点では/v1/が正しいので注意。

3. WEB APIテストクライアントを使ったRESAS APIのテスト

Google ChromeアプリのWEB APIテストクライアントである「Postman」を使って動作確認をしてみましょう。

まずはChromeにPostmanアプリをインストールします。

Google Chromeを使ったweb-apiテストクライアント https://chrome.google.com/webstore/detail/postman/fhbjgbiflinjbdggehcddcbncdddomop?hl=ja

都道府県一覧の取得

試しに都道府県一覧を取得してみましょう。

https://opendata.resas-portal.go.jp/docs/api/v1/prefectures.html

GETするURLにhttps://opendata.resas-portal.go.jp/api/v1/prefectures を指定し、HeadersのKeyにX-API-KEYを、Valueに先程取得したAPI-KEYを指定します。

SendでREST APIを叩いて都道府県データが返ってくれば成功です。

市区町村一覧の取得

次に市区町村一覧を取得してみましょう。このAPIはパラメータとしてprefCode(都道府県コード)を渡してあげる必要があります。

https://opendata.resas-portal.go.jp/docs/api/v1/cities.html

GETするURLにhttps://opendata.resas-portal.go.jp/api/v1/cities?prefCode=23 を指定し、HeadersのKeyにX-API-KEYを、Valueに先程取得したAPI-KEYを指定します。

※prefCode=23は愛知県の都道府県コードです。

SendでREST APIを叩くと今度は愛知県の市区町村一覧が取得できます。

RESAS APIは上記2つのAPIで取得できるprefCodeとcityCodeをパラメータとして取るAPIが多いので、上記2つのAPIは覚えておいたほうが良いです。

人口の自然増減の取得

最後に、人口増減を取得してみましょう。このAPIでは先程の2つのAPIで取得したprefCode(都道府県コード)とcityCode(市区町村コード)をパラメータとして使用します。

※ageFromとageToもRequired=true(必須)となっていますが実際には必須ではありません。

https://opendata.resas-portal.go.jp/docs/api/v1/population/nature.html

GETするURLにhttps://opendata.resas-portal.go.jpapi/v1/population/nature?prefCode=23&cityCode=23100 を指定し、同じようにHeadersのKeyにX-API-KEYを、Valueに先程取得したAPI-KEYを指定します。

※prefCode=23は愛知県の都道府県コード、cityCode=23100は名古屋市の市区町村コードです。

4. 最後に

以上がRESAS APIの使い方の基本となります。

RESAS APIには上記以外にも様々なAPIがあります。仕様書を見ながら自分が取得したいデータのAPIを使ってみたください。

次回はサーバサイドのプログラムでRESAS APIを使ってみたいと思います。

最終更新時刻: 2017年01月22日

RESAS APIを使ってみる(2)

前回に引き続きRESAS APIの使い方です。

本記事では実際にサーバサイドのWebアプリケーションからRESAS APIを使ってデータを取得してみます。

※現状、RESAS APIのAPIキーは非公開を前提としているのでJavaScriptなどのクライアントサイドプログラムでの利用は推奨されません。

サーバサイドのプログラム言語にはPHPを使い、環境にはHerokuを使います。

1. 今回作成するWebアプリケーション

都道府県と市区町村を選択し、自然人口の増減をグラフ表示するWebアプリケーションを作ってみましょう。

2. Herokuの環境を準備する

https://www.heroku.com/

SIGN UP FOR FREEからアカウントの登録をします。

次にHeroku CLIをダウンロードしインストールします。

https://devcenter.heroku.com/articles/heroku-cli

※私の32bit Windows7環境下ではGitがインストールできなかったので、Git for Windowsを別途インストールしました。

https://git-for-windows.github.io/

3. Webアプリケーションを作ってみる

まずはHerokuにログインします。

$ heroku login

空のPHPアプリケーションを作成します。<APP_NAME>はheroku上の他のアプリケーションと被らない名前をつけてください。

$ heroku create <APP_NAME>
$ mkdir <APP_NAME>
$ cd <APP_NAME>
$ touch composer.json
$ touch index.php
$ git init
$ git add .
$ heroku git:remote -a <APP_NAME>
$ git commit -m “first commit”
$ git push heroku master
$ heroku open

ブラウザでhttps://<APP_NAME>.herokuapp.com/ が開き、作成したWebアプリケーションが開きます。

index.phpを以下のように書き換えます。 今回のプログラムでは都道府県の選択画面を実装します。 <API-KEY>はRESAS APIのAPI-KEYに書き換えてください。

<?php

// エラーハンドリングやセキュリティ対策はしていません。実コードでは気をつけましょう。

$base_url = 'https://opendata.resas-portal.go.jp/';
$request_url = $base_url . 'api/v1/prefectures';
$headers = ['X-API-KEY: <API-KEY>'];

$curl = curl_init();

curl_setopt($curl, CURLOPT_HTTPHEADER, $headers);
curl_setopt($curl, CURLOPT_RETURNTRANSFER, TRUE);

// 都道府県を取得
curl_setopt($curl, CURLOPT_URL, $request_url);
$response = curl_exec($curl);

// 都道府県一覧のJSONを配列に格納
$prefectures = json_decode($response, true)['result'];

?>
<html>
<head>
<title>都道府県一覧</title>
</head>
<body>
<form action="cities.php" method="get">
<select name="prefCode">
<?php foreach($prefectures as $pref): ?>
        <option value="<?=htmlspecialchars($pref['prefCode']) ?>"><?= htmlspecialchars($pref['prefName']);?> </option>
<?php endforeach; ?>
</select>
<button type="submit">選択</button>
</form>
<?php ?>
</body>
</html>

書き換えたらDEPLOYします。

$ git commit -am “modified index.php”
$ git push heroku master
$ heroku open

次に、市区町村の選択画面をcities.phpとして実装します。

<?php

// エラーハンドリングやセキュリティ対策はしていません。実コードでは気をつけましょう。

$base_url = 'https://opendata.resas-portal.go.jp/';
$request_url = $base_url . 'api/v1/cities';
$headers = ['X-API-KEY: <API-KEY>'];

$curl = curl_init();

curl_setopt($curl, CURLOPT_HTTPHEADER, $headers);
curl_setopt($curl, CURLOPT_RETURNTRANSFER, TRUE);

// 市区町村を取得
curl_setopt($curl, CURLOPT_URL, $request_url . '?prefCode=' . rawurlencode($_GET['prefCode']));
$response = curl_exec($curl);

// 市区町村一覧のJSONを配列に格納
$cities = json_decode($response, true)['result'];

// print_r($cities);

?>
<html>
<head>
<title>市区町村一覧</title>
</head>
<body>
<p><a href="index.php">都道府県選択に戻る</a></p>
<form action="population.php" method="get">
<input type="hidden" name="prefCode" value="<?=htmlspecialchars($_GET[prefCode]); ?>" />
<select name="cityCode">
<?php foreach($cities as $city): ?>
        <option value="<?=htmlspecialchars($city['cityCode']) ?>"><?= htmlspecialchars($city['cityName']);?> </option>
<?php endforeach; ?>
</select>
<button type="submit">選択</button>
</form>
<?php ?>
</body>
</html>

再びDEPLOYします。

$ git add .
$ git commit -m “add cities.php”
$ git push heroku master
$ heroku open

最後に、人口の自然増減をグラフ上にプロットするためのpopulation.phpを実装します。グラフの表示にはGoogle Chartsを使いました。

https://developers.google.com/chart/

<?php

// エラーハンドリングやセキュリティ対策はしていません。実コードでは気をつけましょう。

$base_url = 'https://opendata.resas-portal.go.jp/';
$request_url = $base_url . 'api/v1/population/nature';
$headers = ['X-API-KEY: <API-KEY>'];

$curl = curl_init();

curl_setopt($curl, CURLOPT_HTTPHEADER, $headers);
curl_setopt($curl, CURLOPT_RETURNTRANSFER, TRUE);

// 市区町村を取得
curl_setopt($curl, CURLOPT_URL, $request_url . '?prefCode=' . rawurlencode($_GET['prefCode']) . '&amp;cityCode=' . rawurlencode($_GET['cityCode']));
$response = curl_exec($curl);

// 人口増減のJSONを配列に格納
$population = json_decode($response, true);

?>
<html>
<head>
<title>自然人口増減(男性のみ)</title>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load('current', {'packages':['bar']});
      google.charts.setOnLoadCallback(drawChart);
      function drawChart() {
        var arrData = [['Year', 'population'],
        <?php foreach($population['result']['bar']['mandata'] as $mandata): ?>
                ['<?=$mandata['year']?>', <?=$mandata['value'];?>],
        <?php endforeach; ?>];
        var data = google.visualization.arrayToDataTable(arrData);

        var options = {
          bars: 'vertical',
          hAxis: {
                title: 'Man Population',
                minValue: 0,
                }
        };

        var chart = new google.charts.Bar(document.getElementById('barchart'));

        chart.draw(data, options);
      }
    </script>
</head>
<body>
<p><a href="cities.php?prefCode=<?=rawurlencode($_GET['prefCode']); ?>">市区町村選択に戻る</a></p>
<div id="barchart" style="width: 900px; height: 500px;"></div>
</body>
</html>

DEPLOY方法はさきほどと同様です。

$ git add .
$ git commit -m “add population.php”
$ git push heroku master
$ heroku open

4. 最後に

以上でWebアプリケーションは一旦完成です。

表示されないなどの不具合があった再には以下のコマンドでログを確認することができます。

Heroku logs

最終更新時刻: 2017年01月22日