iframeで埋め込んだGoogle Mapが表示されない

Question

iframeで埋め込んだGoogle Mapが表示されなくなりました。

######コード

<iframe src="https://maps.google.co.jp/maps?output=embed&q=原宿駅"></iframe>

######コンソールのエラー

Refused to display 'https://maps.google.co.jp/' in a frame because it set 'X-Frame-Options' to 'sameorigin'.

他サイトの埋め込みを拒否しているみたいです。
Googleの仕様が変更されたのでしょうか。

また、他で代わりになるものがありますでしょうか。
料金がかからないようにしたいです。

Comments

[K_3578]

急に表示されなくなったのですか？

[fujiraidar]

はい。非公式な方法だったらしく、制限されたのかもしれません。

[m.ts10806]

URLはどこからどのように取得したのでしょうか。

[m.ts10806]

APIきちんと使いこなすしかありません。

Answer 1

Googleマップ上で検索して、
「地図を埋め込む」をやると、URLがまるで違いますが。

<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3241.275066385031!2d139.70050891585618!3d35.67022848019684!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x60188cbac9b52cff%3A0x560d87a8e2d1d3d2!2z5Y6f5a6_6aeF!5e0!3m2!1sja!2sjp!4v1621994059884!5m2!1sja!2sjp" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy"></iframe>

利用規約に則って利用しましょう、としか言えません。

Comments

[fujiraidar]

データベースから取ってきた住所や経度・緯度データからiframeでGoogle mapを表示したいのですが、方法ありますでしょうか

[退会済みユーザー]

Google Maps APIを使ってください。
Maps Static API Go to Console https://developers.google.com/maps/documentation/maps-static?hl=ja
Maps JavaScript API https://developers.google.com/maps/documentation/javascript?hl=ja

[fujiraidar]

ありがとうございます。
リクエスト数がある一定を超えると料金が発生してしまわれると思うのですが
絶対に料金が発生しない方法はないのでしょうか。

[退会済みユーザー]

利用規約に則って利用しましょう、としか。
何かしらの工夫で一時的に回避ができても、サーバーは一つでしょうから、BANされて以後利用できなくなるなんてことになっても知りませんし。

[退会済みユーザー]

他の地図表示ライブラリを使って、制約のゆるい地図（OpenStreetMapや地理院地図）を使うなら。
でもGoogleマップの見た目がほしいのであれば、選択肢にすらなりませんし。

[fujiraidar]

Googleマップで絶対に料金が発生しない方法はないのですね。
ありがとうございます。

[Lhankor_Mhy]

横からすみません。

> All Maps Embed API requests are free with unlimited usage.
https://developers.google.com/maps/documentation/embed/usage-and-billing?hl=ja

とのことなので、Maps Embed API であれば、現状は無料なのではないかと思います。
試したわけではないですが。

[fujiraidar]

ありがとうございます。
無料みたいでした。
実装してみます。