AWS CloudFront で OpenStreetMap や 国土地理院タイル を Elastic化して Leaflet / OpenLayers3 や Kibana から参照 (前編)

# 概要

![スクリーンショット 2016-09-18 17.35.25.png](https://qiita-image-store.s3.amazonaws.com/0/69410/d1369f98-a9b1-4979-1ccc-8515c2b1f7a2.png)

[前編](http://qiita.com/exabugs/items/35699c14a08171c2c76a) : タイルサーバを CloudFront を使って CDN 配信する
[後編](http://qiita.com/exabugs/items/3cc10fa3380d738ef9ab) : CloudFront をタイルサーバとしてクライアントを作成する






# はじめに(前編)








2016/07/11 に、Kibanaで地図が表示されない事象が発生しました。
https://www.elastic.co/jp/blog/kibana-4-5-3-and-4-1-10
MapQuest 社のサービス打ち切りが原因ですが、影響を被った人やサービスは、かなりの数になるでしょう。
![d69bc47e-1d68-c596-49e3-0b3dfdbb5e72.png](https://qiita-image-store.s3.amazonaws.com/0/69410/490e165e-fc0a-24c2-6604-1f7d8a05c90e.png)



それを契機に調査を開始したところ、タイルサーバを自前で用意するという以下の記事が、たいへん参考になりました。
[OpenStreetMapサーバを自作する(Install OpenStreetMap on AWS EC2/Ubuntu14.04)](http://dev.classmethod.jp/cloud/aws/install-openstreetmap-on-ec2-ubuntu14_04/)

ところが、m3.xlarge だと 33,000円/1台/1ヶ月 で、可用性のため2台構成とかにすると、もうそれだけで赤字プロジェクトになってしまいます。
また、データの更新に追随するのは、かなりたいへんです。


そこで、

 - オリジンのタイルサーバに負荷をかけないこと。
 - データの更新を自動で取り込むことができること。
 - 急な負荷変動、また、大きな負荷に耐えること。
 - 使っただけの従量課金であること。
 
を考えた時に、まさにこのCloudFront構成に行き着くことになります。

前編では、サーバ側の設定について、順番に見ていきます。

![スクリーンショット 2016-09-18 17.23.19.png](https://qiita-image-store.s3.amazonaws.com/0/69410/bb981da2-b5ab-9790-a2db-fa067a326bcb.png)
(前編の範囲)

## タイル情報
今回は、以下の代表的な3サイトを対象に、CloudFront化 していきます。

### OpenStreetMap
http://www.openstreetmap.org/



サービス URL : http://tile.openstreetmap.org/

ウィキペディアより
>オープンストリートマップ（英語：OpenStreetMap、OSM）は自由に利用でき、なおかつ編集機能のある世界地図を作るための共同作業プロジェクトである。GPS機能を持った携帯端末、空中写真やほかの無料機械からのデータをもとに作られていくのが基本だが、編集ツール上で道一本から手入力での追加も可能である。与えられた画像とベクトルデータセットはオープンデータベースライセンス (ODbL) 1.0のもと再利用可能である[1]。登録したユーザーであれば、GPSのログファイルをアップロードしたり、ベクトルデータをエディタで修正することができる。

MapQuest も地図データは OpenStreetMap を使用しています。

[タイル利用規約](http://wiki.openstreetmap.org/wiki/JA:%E3%82%BF%E3%82%A4%E3%83%AB%E5%88%A9%E7%94%A8%E8%A6%8F%E7%B4%84)

### 国土地理院
http://maps.gsi.go.jp/development/ichiran.html

サービス URL : https://cyberjapandata.gsi.go.jp/xyz/

標準地図、オルソ画像、条件図、標高図、昔(1970〜)の航空写真画像 など、多くのオープンデータがそろっています。
また、[ベクトルタイル提供実験レポジトリ](https://github.com/gsi-cyberjapan/vector-tile-experiment) では、道路/鉄道/河川 の中心線をベクトルタイル形式で提供開始しました。
(後半では、このタイルも取り込んでいます)

>基本測量成果となっているタイルを利用する際には、測量法に基づく申請が必要な場合があります。
詳しくは、国土地理院の地図の利用手続をご参照ください。

[利用手続](http://www.gsi.go.jp/LAW/2930-index.html)

### 産業技術総合研究所
https://gbank.gsj.jp/seamless/wmts/wmts.html

サービスURL : https://gbank.gsj.jp/seamless/tilemap/

地質・断層・褶曲 情報を入手することができます。
緯度・経度からピンポイントで地質情報を教えてくれるサービスもあります。

(ここが出している、地質・断層等の情報を OpenStreetMap に重ねて表示したい、というのがそもそものモチベーションでした)

## サーバ側

### CloudFront
今回の主役 CloudFront の登場です。

 - 利用規約により、オリジンサーバのリソースを逼迫させるのはNGですが、CloudFront経由なら、どんなにアクセスがあっても、オリジンサーバへのリクエストはキャッシュ有効期間内なら 1タイル につき 1回のみ です。
 - しかも国内二箇所(東京・大阪)のCloudFrontエッジサーバのおかげで、オリジンサーバよりも高速にサービス提供が可能です。
 - データ更新があれば、それも適宜、自動で更新されるでしょう。

まさに、このためにCloudFrontは開発されたのではないか、と思われるほどベストマッチです。


今回は、上記の３サービスをひとつの CloudFront にまとめたいので、Pathパターンとオリジンの組み合わせを上手く考えなければいけません。
というのも、CloudFront では、設定上、以下の制限があります。

 - 赤枠部分 (パス前半部分) でオリジンを決定すること
 - オレンジ部分は、CloudFront側 と オリジンサーバ側 で等しいこと

![スクリーンショット 2016-09-18 21.24.10.png](https://qiita-image-store.s3.amazonaws.com/0/69410/e958c567-bf33-35f6-1333-3272ee3b342a.png)



つまり、パス部分が偶然等しく区別が付かない場合は、一つのCloudFrontにまとめることはできないわけです。
(この部分は、マッピングを自由に変更できるよう、将来のバージョンでは改良されるでしょう)

今回対象となる３サイトでは、うまく設定することができました。
以下、上手くできたパターンを紹介します。

オリジン設定
![a700a677-59a0-de5a-3449-b5955c1d54be.png](https://qiita-image-store.s3.amazonaws.com/0/69410/9cb174f6-fd3b-f041-0c95-7445455bafc5.png)


|オリジン ドメイン|パス|プロトコル|
|-----------|----|---------|
|gbank.gsj.jp|/seamless|https|
|cyberjapandata.gsi.go.jp| |http|
|tile.openstreetmap.org| |http|

ビヘイビア設定
![fbfb6eae-5e0a-74e9-9c5f-a1c92dbd422e.png](https://qiita-image-store.s3.amazonaws.com/0/69410/b0fae6c8-9fb3-0669-b232-8a804bc3ea9e.png)



|Path パターン|オリジン|
|----|----|
|/tilemap/*|gbank.gsj.jp/seamless|
|/xyz/*|cyberjapandata.gsi.go.jp|
|Default(*)|tile.openstreetmap.org|


つまり、以下となります。

|CloudFront|オリジン|
|------|------|
|http://[cloudfront]/tilemap/* |https://gbank.gsj.jp/seamless/tilemap/*|
|http://[cloudfront]/xyz/* |http://cyberjapandata.gsi.go.jp/xyz/*|
|http://[cloudfront]/* |http://tile.openstreetmap.org/*|

以上で、タイルサーバの準備ができました。


## まとめ

 - OpenStreetMap を始めとする、代表的なタイルサーバの情報を、CloudFront を使って、オリジンサーバに負荷をかけずに効率的に配信する仕組みを構築しました。
 - 実際の業務で使うには、個別に契約の確認が必要だと思います。
 - 各種クライアントからの利用/設定は[後編](http://qiita.com/exabugs/items/3cc10fa3380d738ef9ab)に続きます。