おすすめ 全ての記事

エックスサーバーでSSL化しても「保護されていない通信」となってしまう問題の解決法

私もブログサイトをゆるく運営しはじめて、半年ほどが経ちました。
デザインに凝ってみたり、赴くままに文書を書いたりしていたのですが、ある時、ふと気になることがありました。

始めの方に、エックスサーバー(XSERVER)でSSLの設定をしたはずだったので、セキュリティ保護された鍵のマークがついていない理由が謎でした。

自分なりに調べてみて、やっと解決したので、今回はその方法をシェアしたいと思います。

常時SSL設定をしてるのに「保護されていない通信」になる理由

画像やリンクのURLがhttp://~のままになってしまっている

エックスサーバーで常時SSL設定をし、ワードプレスでもホームページをhttps:~で設定しているにもかかわらず、保護通信にならないのは、ほとんどの場合でページ内にhttps化されていない古いリンクが入っているからです。

常時SSL通信にするには、これを新しいものに差し替えればよいので、次にどこがhttps化されていないのかを知るために、httpのままのリンクの探し方をお伝えします。

➀httpリンクの探し方

(今回は、googleのchromeのブラウザでの解説をします。)

まずは、対象となるサイト(https化されていないサイト)にアクセスし、右上端にある設定メニューを開き、その他のツール→デベロッパツールの順に開きます。

これを選択すると、デベロッパーツールが起動します。
すると、consoleという画面が開き、この中で「Mixd Content」というエラーが発生していることが分かります。

このエラーこそが、「保護されていない通信」となってしまう正体です!

次に、このエラーの表示の中にある2つ目のリンクをクリックしてみて下さい。

すると、保護されていない通信となってしまう原因の画像が表示されました!

今回は、ロゴの画像だったので、設定からロゴ画像を設定しなおしましょう。

このように、全ての画像を特定し、差し替えていくと、きちんと保護された通信になることができます。

補足:Cocoonを利用している方へ

このように、常時SSL化をするのは簡単なのですが、Cocoonというワードプレステーマを使用している私には、分からないことがありました。

おまえは誰だ

それが、上記のように、自分で設定していない謎の画像がエラーの原因になってしまっていたことです。

自分で設定していないので、この画像自体がどこにあるのか分からず、SSL設定に時間がかかってしまいました。

この画像は、Cocoonを利用している方にデフォルトで設定されている画像で、Cocoon設定→AMPタグ→AMPロゴから画像を新しく設定してみて下さい。

ちなみにAMPとは、ブラウザ上で高速で表示されるようにする手法のことで、その手法で表示される際にこの画像が使用されるようです。

まとめ

いかがだったでしょうか?
今回の方法は、すでにエックスサーバー上でSSLの設定が済んでいて、ワードプレス上の本サイトをhttps:~に設定した上での設定の説明でした。

終わってみれば非常に簡単なことだったのですが、当時はhttpのままのリンク先が分からずに困り果てていました。

現在すでにサイトを立ち上げて時間がたったけど、なぜか常時SSL化できないということであれば、ぜひ参考にしてください。
最後までお読みいただきありがとうございました。

-おすすめ, 全ての記事

© 2023 masa-media|マサメディア