解決済み
5回答
やりたいこと→取得した座標値のマーカーを追加する
教材の手順通り進めておりましたが、エラーが出てしまい止まってしまいました。
エラーの内容は、
RefererNotAllowedMapError
Maps JavaScript APIをロードしている現在のURLは、許可されたリファラーのリストに追加されていません。クラウドコンソールでAPIキーのリファラー設定を確認してください。
とのことですが、Maps JavaScript APIは有効になっており、APIキーもおそらく間違いないかと思います。
どのように進めればよいでしょうか。
全5件の回答
柿本
講師2021年08月03日 10:09
consoleログにはどのようなエラーが出ていますでしょうか。
ブラウザのdeveloperツールを利用してご確認いただけると幸いです。
山田睦
2021年08月03日 11:09
(編集済み)
ご回答有難う御座います。
この画面でお間違いないでしょうか。
間違いなければ、右下に赤文字で下記エラーが出ているようです。
Google Maps JavaScript API error: RefererNotAllowedMapError wp-google-maps.min.js?ver=8.1.13:1
https://developers.google.com/maps/documentation/javascript/error-messages#referer-not-allowed-map-error
Your site URL to be authorized: http://wispy-saga-2086.heavy.jp/wp-admin/admin.php
console.error @ wp-google-maps.min.js?ver=8.1.13:1
キャンセル
柿本
講師2021年08月03日 11:08
Google API側の設定でアクセスを許可しているリファラーにご自身のホストは入っていますでしょうか。
ご確認お願いいたします。
「アプリケーションの制限」で「HTTPリファラー」を選択します。そして、「新しいアイテム」には自分のWebサイトURLを以下の例に従って入力しましょう。
（例）元のURL http://wordpress.local-> 入力するURL wordpress.local/*
/*を忘れないようにしましょう。入力後は「完了」をクリックして、次の「APIの制限」に進みましょう。
山田睦
2021年08月03日 11:19
恐らくアイテムの編集というところで、リファラーに入れる文言が違っているのかと思います。
教材通りリファラーには「sample.local/*」と入力してしまっていました。
ここが違っていますか？
だとすると（例）元のURL http;//wordpress.local->にあたる部分が分かりません。
どこで確認ができるのでしょうか。
キャンセル
柿本
講師2021年08月03日 11:22
教材通りリファラーには「sample.local/*」と入力してしまっていました。
ここが違っていますか？
そうですね。
ここはご自身のwordpressのURLを入力してください。
山田睦
2021年08月03日 12:06
http;//wispy-saga-2086.heavy.jp/がwordpressのURLだったので、wispy-saga-2086.heavy.jp/と入力しましたが同様のエラーが解消されませんでした。
キャンセル
柿本
講師2021年08月03日 12:17
wispy-saga-2086.heavy.jp/*としてみてください。
またそれでもうまく行かない場合は、再度consoleログをご共有いただけると幸いです。
山田睦
2021年08月03日 12:25
先ほどとはエラー画面が変わり、このページでは Google マップが正しく読み込まれませんでした。と出るようになりました。
これで問題ないのでしょうか。
念のためconsoleログのキャプチャもお送りさせて頂きます。
キャンセル
柿本
講師2021年08月03日 12:45
これで問題ないのでしょうか。
念のためconsoleログのキャプチャもお送りさせて頂きます。
クレジットカードなどの請求情報を有効化する必要がある旨のエラーが発生しております。
Google APIアカウントから請求情報を有効化してください。
キャンセル
