プログラミング

「Google Maps API」改め「Google Maps Platform API」の取得方法を解説【2019年版】

更新日:

Googel Map Platform APIキーを取得して、Map表現の幅を広げる

どうも、カッパです。

ホームページ制作をしていると、次の要望が結構あります。

  • 入力した住所の地図を表示したい
  • 地図の表示をカスタマイズしたい

これらの要望を満たすには Google Maps API を利用する必要があります。APIを利用するには Google Mas APIキー を取得する必要があり、APIキーを取得するには Google Maps Platform のページから各種情報を登録して行います。

それではAPIキー取得の手順を解説しますが、前提条件として

  • Googleアカウント取得済み
  • Webブラウザでログイン済み

であるとします。

また、すぐに料金の支払いは発生しませんが、クレジットカードの登録が必要になるので、手元に用意しておきましょう。

まずは Google Mas Platform のページにアクセス

Google Mas APIキーを取得するために公式サイトにアクセス
APIキーは、この「Google Maps Platform 公式サイト」から取得します。

まずは Google Maps Platrom の公式サイトにアクセスします。

右上またはメインイメージ内に「使ってみる」ボタンがあるので押してみましょう。

Google Maps Platformのサービスを選択する

3つのサービスから「マップ」を選択してGoogle Maps APIキーを取得する
Google Maps Platformの3つのサービスの中から「マップ」を選択する

「Google Maps Platformの有効化」というダイアログが出るので、今回は「マップ」を選択します。

サービスを選択したらプロジェクトを作成

Google Maps APIキーを使用するプロジェクトを作成
Google Maps APIキーを使用するには、Google Cloud Platformにプロジェクトを作成する必要がある

プロジェクト名は後から変更可能なので、ここはデフォルトの「My Project」でもなんでもいいので適当にプロジェクトの名前をつけておきましょう。

Google Maps Platformが有効化されたら個人情報やクレジットカードの情報を入力

Google Maps Platformの無料トライアル登録画面
Google Maps Platformの無料トライアル登録画面

Google Maps Platformが有効化されると、無料トライアルの登録画面が表示される、画面の指示にしたがって各種情報を登録する。

Google Maps Platform APIの有効化が完了

Google Maps Platform APIが無事に有効化された
Google Maps Platform API有効化のお知らせ

この画面が出たら無事 Google Maps Platform API が有効化されたことになります。一般的に使われる7つのAPIが自動で有効化されています。

Google Maps Platform APIの認証を行い、APIへのアクセス制限を行う

APIが有効化されると、Google Cloud Platformのコンソールに自動的に移動します。

Google Map Platform APIのAPIキーが表示されたGoogle Cloud Platformのコンソール画面
右側に表示されているのが(隠してあるが)今回取得したGoogle Map Platform APIのAPIキーである

右側に表示されているのがAPIキーです。隠してありますが、本来APIキーはJavaScriptに記述するものなので、誰でも見ることができます。

けど一応...。

この状態だとまだAPIの使用制限が設定されていないので、これからAPIに使用制限をかける設定を行います。

ひとまず自分のサイトのHTTPリファラーによる制限をかける

Google Map APIキーを取得し、制限をかける
取得したGoogle Maps Platform APIキーを自分のサイトでのみ使えるように設定する

同じ画面から「アプリケーションの制限」の「HTTPリファラー(ウェブサイト)」をチェックし、自分のドメインでの使用を許可するように設定します。

ワイルドカードを使って「https://*.kappasta.com/*」と入力することで、サブドメイン、サブディレクトリでの使用が可能になります。

Google Maps APIが使えると、ホームページ制作案件の提案の幅が広がります

Google Maps APIの詳しい使い方については、今後記事を追加していく予定です。お楽しみに。

Mapの表現が多様になると、ホームページ制作を提案する際にアイデアの幅が広がると思います。まずはAPIキーを取得し、自分でいろいろ試して見ることをおすすめします。

ただし、APIの使用は、場合によっては完全無料ではないので、その点はクライアントとよく相談し、支払いのルール等を決めておく必要があります。注意しましょう。

それでは良いGoogle Mapライフを。

-プログラミング

Copyright© kappasta. , 2021 All Rights Reserved.