Google マップのコードをiframeで埋め込むと、httpsでエラーが出るという症状に悩まされて睡眠不足になったお話

どうも。

会社の中で最年長、日々着々と老化する頭脳で、日々刻々と進化していくWEBと格闘しているWEBプランナーの花沢です。

この記事のタイトルを読んで、一般の方的には「なんのこっちゃ」と思われるかと思いますが、ここ最近、これに悩まされているWEBクリエーターの方って結構居るんじゃないでしょうか。
私も少し前から相当悩まされたので「記録」として書いておきます。検索で辿り着いた方の参考になれば幸いです。

の、前にちょっと余談。

ご存じの様に、現在のインターネットでは、我々の様にWEB関連を生業にしている者だけでなく、一般の方も様々なサービスで「Google」さんにお世話になっております。
検索エンジンに始まって、Youtube、Android OS、Gmail、Chrome、マップ、アクセス解析、、、他にもまだまだたくさんあって、それらに完全に依存してるわけです。なんだったら、軽く支配されてると言っちゃってもいいかもしれませんね。

とは言え、そんなGoogleでも、勇んでスタートしたは良いものの、見事にコケてしまったサービスが過去には沢山あります。精力的というかなんというか、トライ＆エラーしまくりなんですよね。ちなみに、Googleの廃止された（される）サービスを一覧できるサイトがありますので、興味のある方はぜひ(笑)。

Killed by Google

廃止予定はギロチン、廃止されたものは墓石がアイコン表示されているというシュールなサイトです(笑)。

さて、本題へ。

数週間前、当社でSSL化（サイト暗号化）したクライアント様のWEBサイトをチェックしていたら、通常であればURLの前に鍵アイコン「」が表示されるはずなのに、エクスクラメーション（ビックリマーク）「」が表示されている事に気が付きました。

マークをクリックしてみると

このサイトへの接続は完全には保護されていません
このサイトで目にする画像は、悪意のあるユーザーによって差し替えられたものである可能性があります。

うげっ。これは印象悪い。

エラーの出ていないサイトと比較をしてみると、どうやらGoogle マップをiframeで埋め込むとこの状態になるらしい事が判明。
※当社の「会社案内のページ」にはGoogle マップを埋め込んであるのでアクセスしてURLのマークをチェックしてみて下さい。

原因が解ればこっちのもの、さっそく対策を開始。
しかし、あれやこれやとやってみるも解消せず。

連日、Google ChromeでGoogle マップのエラーが表示されるのを回避する方法をGoogleで検索するという、なんとも空しい作業を繰り返し、唯一得た情報は

<iframe src="https://www.google.com/maps/embed?pb=xxxxx" width="800" height="600" frameborder="0" style="border:0" allowfullscreen></iframe>

上記の埋め込みコードの「https」を「#104;ttps」に変えてやるというもの。 しかし、これでは解消せず。むー、、、難しい。

悩み始めて数日目、深夜1時。

デバックで吐き出されたエラーコードをボーっと見つめていると

Mixed Content: The page at 'https://XXXXX.XXX' was loaded over HTTPS, but requested an insecure image 'http://maps.gstatic.cn/mapfiles/embed/images/google4.png'. This content should also be served over HTTPS.

、、、え？「maps.gstatic.cn」、、、「.cn」？中国？
Googleのロゴを中国のサイトから読み込んでるの？

ていうか、そもそもGoogleのロゴを読み込む画像のURLがhttpsになってないけど。

http://maps.gstatic.cn/mapfiles/embed/images/google4.png

この画像のURLにアクセスするとSSLエラーで「」が表示される。

んじゃ、httpをhttpsにしてアクセスしてみると

https://maps.gstatic.cn/mapfiles/embed/images/google4.png

、、、エラーが出ない。

つまりGoogleのロゴマークの読み込みURLがSSL化（https記述）されていないっていうのが原因？

(　ﾟдﾟ)ﾎﾟｶｰﾝ

という事で、これが原因かどうかは解りませんが、とりあえず Googleさんにフィードバックを送って修正を待ってみたいと思います。

てか、俺の睡眠時間を返してくれ。

では、また。

2019年9月2日 追記

休み明けに出社して確認したところ、

https://maps.gstatic.com/mapfiles/embed/images/google4.png

となっていました。修正されたようですね。
私のフィードバックが効いたのかどうかは定かでは無いですが、とりあえず一件落着。