MonstarX のアプリに Google Maps を接続する

要点アプリでは、はじめから無料で地図を表示できます。スポットの検索、入力中の住所の自動補完、店舗情報やクチコミ、ルート案内など、Google のデータを使いたいときに Google Maps を接続します。Google Cloud で API キーを作成し、「バックエンド」→「クラウド」に貼り付けて、機能を頼みます。

Google の地図、スポット検索、ルート案内。

種類: アプリ用
カテゴリ: 地図と場所
接続方法: API キー

Google Maps Platform は、Google マップの裏側にあるスポット、住所、営業時間、クチコミ、ルートといった地図データを提供する Google のサービスです。接続すると、アプリがそのデータを調べられるようになります。

地図を表示するだけなら必要ありません。MonstarX のアプリはどれも、ピン付きで移動・拡大できる地図を無料で表示できます（アプリに地図を表示するをご覧ください）。Google Maps は、その地図だけではわからない情報のために使います。

何が作れますか？

住所の自動入力：住所を入力し始めると Google の候補が表示され、選ぶだけで入力できます。
スポット検索：「近くのカフェ」「Fitzroy の理学療法士」などを、リストと地図で表示します。
店舗情報：スポットの営業時間、電話番号、評価、クチコミ。
住所を地図に表示：入力された住所をピンに変えます（ジオコーディングといいます）。
2つの場所の間の車でのルート案内。

始める前に

請求先アカウントを設定した Google Cloud のアカウントが必要です。Google Maps Platform では、毎月の無料枠の範囲内でも請求先アカウントが必須です（Google の料金をご覧ください）。
アプリ用の Google Cloud プロジェクト。

キーを取得する

Google Cloud コンソールでプロジェクトを選ぶか作成し、Google Maps Platform を開きます。
アプリで使う API を有効にします。上の例なら、検索と自動入力には Maps JavaScript API と Places API (New)、住所には Geocoding API、ルート案内には Routes API です。
Keys & Credentials（キーと認証情報）を開いて API キーを作成し、コピーします（AIza で始まります）。
キーを制限します。API restrictions（API の制限）で、有効にした API だけを許可します。

MonstarX で接続する

プロジェクトを開き、上部バーの バックエンド をクリックしてから クラウド を開きます。
コネクタ の Google Maps の横にある 接続する をクリックします。
キーを API キー に貼り付けます。
Google Maps を接続 をクリックします。行に 接続済み と表示され、キーを読み込んでプレビューが再起動します。

MonstarX に頼んでみる

入力する内容	どうなるか
「予約フォームの住所を Google Maps で自動入力できるようにして」	入力中に候補が表示され、選んだ住所が保存されます。
「Google Places の検索で、近くのスタジオを探せるページを追加して」	検索欄と、名前・住所・評価付きの検索結果ができ、地図にピンが表示されます。
「各カフェの営業時間と評価を Google から表示して」	スポットごとに Google から店舗情報を取得します。
「配送センターから各配達先までのルートをドライバーに案内して」	距離と所要時間付きのルートが表示されます。

セキュリティとプライバシー

このキーは公開キーです。利用者のブラウザで使われるため、隠されてはいません。キーを守るのは、Google Cloud での制限です。
キーはこのアプリ専用に保存されます。名前はバックエンドシークレットに表示されます。
Google Maps を接続、更新、接続解除できるのはプロジェクトのオーナーだけです。
キーを入れ替えるには、Google Cloud で新しいキーを作成し、Google Maps の行の キーを更新 をクリックして貼り付け、キーを保存 をクリックします。もう一度公開してから、古いキーを削除してください。

知っておくと便利なこと

地図の見た目は変わりません。Google Maps がアプリに加えるのはデータと検索で、Google の地図画像ではありません。
毎月の無料枠を超えると、Google はリクエストごとに料金を請求します。Google Cloud の請求設定で予算アラートを設定しておきましょう。
衛星写真や Mapbox の地図スタイルを使いたい場合は、Mapbox をご覧ください。
Google の規約には、検索結果の横に Google のクレジットを表示するなど、スポット情報を表示するときのルールがあります。アプリでスポットを一覧表示する場合は、クレジットの追加を MonstarX に頼んでください。

よくある質問

地図を表示するのに Google Maps は必要ですか？

いいえ。MonstarX のアプリはどれも、キーなしで無料の地図を表示できます。Google Maps を接続するのは、スポット検索、住所の自動入力、店舗情報、ルート案内を使うときだけです。

Google に「API が有効になっていない」と言われるのはなぜですか？

Google Maps の各サービスは、Google Cloud プロジェクトで個別に有効にする必要があります。エラーに出ているサービス（Places API (New) など）を有効にしてください。

キーがブラウザにあっても安全ですか？

はい。アプリで使う API に制限していれば安全です。これらのキーは、ウェブページで使う前提で設計されています。

Google Maps と Mapbox、どちらを使えばよいですか？

スポット、店舗情報、クチコミなら Google Maps。独自の地図スタイルや衛星写真なら Mapbox です。住所をピンに変えることとルート案内は、どちらでもできます。