Google Map Api キーを取得

Google Mapは、APIキーを取得して使わないと、JavaScriptのConsoleが常にエラーを吐くようになります。また、いつサービスを打ち切られちゃうかわかりません。というわけで取得手順。

プロジェクトの新規作成

https://console.developers.google.com

にアクセスして、「プロジェクトを選択して……」で、「プロジェクトの作成」を行います。

Google Map APIキーを有効にする

「認証情報」から「認証情報を作成」で「APIキー」を選択し、「ブラウザキー」を取得します。専用サーバだったら「サーバーキー」でもいいのかもしれませんが、未確認です。

「ブラウザキー」の名前は任意のものでよいです。「この HTTP リファラー(ウェブサイト)からのリクエストを受け入れる (省略可)」は、省略せずにプレイスホルダの例の通り、

*.example.com/*

場合によっては、

example.com/*

を登録します。wwwなしで運用している場合は、上の登録だとNGになりそうです。

作成すると、APIキーを取得できます。

Google Map APIキーを有効にする

でも、このままだと、指示通り、

<script type="text/javascript" src="https://maps.google.com/maps/api/js?key=YOUR_API_KEY"></script>

としても、

このページでは Google マップの要素を表示できませんでした。
ApiNotActivatedMapError

と言うようなエラーが出てしまいます。

「概要」「Google Maps JavaScript API」で「有効にする」ことで、このエラーを抑止して、利用できるようになります。

ジャンル: Web