APIキー取得Googleマップの表示を行うためには
貴社にてAPIキーを取得して頂く必要がございます

APIキー取得

※APIキーの取得には、Google Chromeブラウザを推奨します。

「Google Maps Platform」にアクセスしてください。

※ログインしていない場合はアカウントを作成してログインしてください。
右上の「スタートガイド」か左下の「使ってみる」をクリックしてください。

1.Pick a product

どのAPIを有効にするかチェックする所がありますので3つともチェックを入れて「CONTINUE」ボタンを押してください。

2.Select a project

プロジェクト名を設定します。

Select or create project で 「+Create a new project」を選択してください。

「My Project」と仮のプロジェクト名がつきます。（後で変更が可能です）
※ここでは「My Project」のまま進みます。
右下の「NEXT」をクリックします。

3.Set up your billing

請求先情報の登録画面になります。

受諾で はい を選択「同意して続行」をクリックしてください。

ここでは お客様情報とクレジットカード情報を入力します。

お客様情報とクレジットカード情報が登録されると「APIの有効化」に移ります。

「次へ」をクリックしてください。

APIの有効化が完了したら APIキーが表示されます。

これでAPIキーは取得できました。
※「My Project」が 反映されるまで数分かかる場合があります。

APIと認証情報の設定方法

上記で取得したAPIキーは、まだ制限がかかっていません。
この状態では誰でもこのAPIキーを利用する事ができてしまうので以下の方法で制限をかけます。
キーの利用を制限する事で、このキーを使用できるウェブサイト（貴社ホームページ）を指定できます。

「Google Cloud Platform」へアクセスします。

違うプロジェクトになっている場合は上の▼をクリックして「My Project」に変更します。

「APIの概算に移動」をクリックします。

APIの設定

「有効なAPIまたはサービスがありません」と でますので「APIとサービスの有効化」をクリックします。

APIライブラリのページで「Maps JavaScript API」をクリックしてください。

「有効にする」ボタンを押してください。

「Maps JavaScript API」が有効になりました。

サイドメニューの「API」をクリックして「未使用の API」から「Geocoding API」を追加してください。

【注意】
未使用の APIから、「Geocoding API」を 追加して有効にしてください。(必須)
「Maps JavaScript API」と、「Geocoding API」を有効にする必要があります。

認証情報の設定

左上の「Google Cloud Platform」のロゴをクリックしてトップページに移動してから

「APIの概算」に移動をクリックします。

サイドメニューの「認証情報」をクリックします。


「認証情報を作成」ボタンを押して 「ウィザードで選択」エリアをクリックしてください。

ウィザードでは「Maps JavaScript API」を選択して「必要な認証情報」ボタンを押してください。

APIキーが新しく作られました。

次にAPIキーのアクセス制限の設定をします。「キーの制限」をクリックしてください。

ここでは「APIキーの利用制限」をします。

ラジオボタンの「HTTPリファラー(ウェブサイト)」をクリックします。

「このHTTPリファラー(ウェブサイト)からのリクエストを受け入れる」の欄で GoogleMapsを設置するURLを登録します。

貴社独自ドメインが abc.com の場合の記入例

URLにwww を付ける場合
http://www.abc.com/*

URLにwww を付けない場合
http://abc.com/*

とご記入ください。
（最後に必ず /* を付けてください。無いとエラーになります）

URLを入力したら「保存」ボタンを押してください。

APIの設定画面に戻りました。こちらのAPIキーを使ってください。

「API Key」の横のが無くなっている事を確認してください。
□（フォーム左の四角）ボタンをクリックしてコピーしたAPIキーをメモしておいてください。

以上で認証情報の設定は終了です。