テンプレート販売開始しました!   

ワードプレス

SimpleMap 表示されない原因は…?【よくある失敗例と解決策】

simplemapが表示されない、、
  • 「APIキーは発行したのになぜか表示されない」
  • 「設定方法があってるのか知りたい」

こんな疑問に答えます。

APIキー発行したのに表示されないときは「支払い設定」をしたかどうかまずチェックしてみてください。

GoogleAPIの有料化に伴い、新規で発行されるAPIには必ず支払い設定が必須となりました。

この方法でほとんどは解決できるはず。

本記事の権威性

当サイトはsimplemapを使っています。設定につまづき検証したところ、解決することができました。実際に試したことをまとめましたので参考ください。

基本操作やカスタマイズについてはこちらでまとめています↓

【図解付き】SimpleMap の使い方と設定方法

前半では「失敗例と解決策」について、後半はつまづきやすい点を中心に図解で手順を解説したいと思います。

「SimpleMapが表示されない…」よくある失敗と解決策

よくある原因

  • 支払い設定をしていない → クレカ登録が必要
  • 設定しているAPIが少ない → 必要なものは3つ
  • ドメイン制限はしていない → 関係なし

僕がハマったのはこの3つ。

実際に解決した手順と合わせてご紹介します。

支払い設定が完了していない

すでにAPI設定が完了しており「うまく表示されない」場合は支払い設定を行ってみてください。

2018年まではこちらの設定を行わなくても、問題なかったのですが有料化になったおかげで支払いの設定が必要になりました。

もし2018年以降に新規でAPIを発行した人の場合はまずはこちらを試してみてください。

 

このように設定すればOKです。

説明にもあるとおり、無料トライアルが終わったとしてもそのまま使えます。

APIのライブラリを登録してあるか

  1. Geocoding API
  2. Maps Static API
  3. Maps JavaScript API

この3つだけ。

Googleマップ関連のAPIは10種類以上ありますが、これだけでOKです。

APIとサービス -  ライブラリ から確認できます。

ドメイン制限は必要か?

おそらくみなさんがつまづくのは「認証情報」や「OAuth」だと思います。

筆者自身もこの設定に問題があるのではないかと試しましたが、結論「未設定」で問題なく動作します。

セキュリティ上の観点からいえば「設定しておくべき」ですが、今回の問題には関係ありません。

 

まとめ

最後に当サイトで設定画面をお見せします。ご自身の設定とあっているかチェックしてみください

Google Cloud Platform ホーム」にアクセスして、APIとサービス - 認証情報 からAPIキーやOAuthの設定ができます

セキュリティを強化したい方はこちらの設定をしておけば問題ありません。

・アプリケーションの制限 → 自分のドメインをいれる

・APIの制限 → 不要

鉛筆マークから「アプリケーション制限」や「APIの制限」の設定ができます。

ダッシュボート画面)

実際このプラグインを使うと、どのAPIを使ったかリアルタイムで閲覧することができます。

APIライブラリ画面)

APIの設定が完了すると「設定」から「管理」というボタンに変わります。

OAuth 同意画面)

お支払い画面)

お支払いの設定は、お支払い - アカウント管理 から確認することができ、指定のプロジェクト名を記載されていれば「支払い設定」は完了しています。

「課金を無効」にしてしまうと、APIが使えなくなるとご注意ください。

今回は以上です。

-ワードプレス

© 2021 ICHIKARA