Google Maps Platform APIキーの取得・設定について

Google Maps Platformの利用に必要な、アカウント作成〜APIの有効化〜Google Maps Platform APIキーの取得・発行〜APIキーの指定についてご紹介します。

 

 

APIキーの設定手順

下記の手順でAPIキーを設定します。

 

①Googleアカウントとプロジェクトの作成

Google APIコンソールにてAPIキーを作成する場合、Googleアカウントにて作成を行います。
Googleアカウントをお持ちでない場合はGoogleアカウントの作成を行う必要がございます。

 

element151

STEP1

Googleアカウントの作成

 

下記のページを参考にGoogeアカウントの作成を行ってください。
https://support.google.com/accounts/answer/27441?hl=ja

 

 

element151

STEP2

Googleアカウントログイン

 

下記のページなどから、Googleアカウントでログインを行ってください。
https://www.google.co.jp

 

 

element151

STEP3

プロジェクトの選択

 

下記のページに接続し、「プロジェクトの選択」をクリックしてください。
https://console.cloud.google.com/?hl=ja

 

 

element151

STEP4

新しいプロジェクト

 

プロジェクト選択画面の「新しいプロジェクト」をクリックしてください。

 

 

element151

STEP5

「作成」ボタンをクリック

 

プロジェクト名を入力して「作成」ボタンをクリックしてください。

 

 

②APIの有効化

「Googleアカウント作成とプロジェクト作成」作業が完了していることを前提とします。
また、下記のGoogle APIコンソールに接続していることを前提とします。
https://console.cloud.google.com/?hl=ja

 

element151

STEP1

APIとサービス

 

作成したプロジェクトが選択されていることを確認し、「APIとサービス」メニューをクリックする。

 

 

element151

STEP2

APIとサービスの有効化

 

「APIとサービスの有効化」リンクをクリックする。

 

 

 

element151

STEP3

新しいAPIライブラリへようこそ

 

 

 

APIを有効にする

 

 

利用したいAPIを選択して、「有効にする」ボタンをクリックする。

 

 

element151

STEP4

ダッシュボード

 

 

ダッシュボードに有効化したAPIが表示されていることを確認する。他に利用したいAPIがある場合は「ステップ2」と「ステップ3」の手順を繰り返す。

 

 

③APIキーの作成

element151

STEP1

認証情報

 

「認証情報」リンクをクリックして、「認証情報を作成」メニューから「APIキー」を選択します。

 

 

element151

STEP2

APIキーを作成しました

 

この時点でAPIキーは作成がされますが、セキュリティの強化のため「キーを制限」設定を行ってください。

 

 

 

element151

STEP3

APIキーの認証設定

 

キーを利用するAPIに適したキーの制限を行います。
キーの制限を行わずにAPIキーを利用した場合、外部にキー情報が洩れると悪意のあるユーザに利用されてしまう恐れがあるのでご注意下さい。
下記から適切な制限を選択して設定を保存して下さい。

 

HTTPリファラー(ウェブサイト)
HTTP リファラーによる制限
IPアドレス(ウェブサーバー、crronジョブなど)
IP アドレスによる制限
Androidアプリ
パッケージ名およびフィンガープリントによる制限
iOSアプリ
iOS バンドル識別子による制限

④APIキーの指定

作成したAPIキーを各APIに指定します。

 

例:Javascript API

 

<script async defer src="https://maps.googleapis.com/maps/api/js?

key=YOUR_API_KEY&callback=initMap" type="text/javascript"></script>

 

例:Geocoding API

 

https://maps.googleapis.com/maps/api/geocode/json?

address=1600+Amphitheatre+Parkway,+Mountain+View,+CA&key=YOUR_API_KEY

 

⑤APIキーの設定確認

APIキーの設定確認はGoogle Chrome(ブラウザ)を使用して行います。

 

 

element152

STEP1

Google Maps Platform API Checker

 

Google Chromeの拡張機能であるGoogle Maps Platform API Checkerの画面を開き、右上の青い「CHROMEに追加」ボタンをクリックします。
(上記のリンクをクリックすると追加する画面が開きます)

 

 

element151

STEP2

CHROMEに追加済みとなればOK

 

ボタンが緑色の「CHROMEに追加済み」に変わっていれば追加完了です。

 

 

element152

STEP3

設定完了

 

Google Chromeで確認したいページを開き、画面右上のピンの色を確認してください。ピンの色によってAPIキーの設定状況が異なります。

 

ピンの種類

 

 

CONTACT US

お問い合わせ

 

Google Maps Platformに関するお問い合わせはこちらから

お問い合わせをする