下の記事では、 SSL 対応が正しく行えているか動作確認する方法を開設しました。
問題があった場合、どのように問題を解決していけばよいのでしょうか。
ここでは、SSLの問題を修正する方法について解説します。
SSLの問題を修正する方法
ここでは Chrome ブラウザを使って問題を修正していきます。
復習になりますが、SSL 対応が正しく行えていない場合、ブラウザの URLバーに鍵マークがつきません。
問題のあるウェブサイトの適当な位置で、右クリックメニューから [検証] を選択します。
すると、開発者ツールが開きます。
開発者ツールで × や ! のアイコンが表示されていて、問題が発生していることがわかります。
× や ! のアイコン左の[Console]タブを開きます。
すると、現在のページで起きているエラーの内容を確認できます。
SSL の問題は “Mixed Content:” から始まるエラーです。
SSL 化するには https:// でのアクセスが必要ですが、http:// のままになっているコンテンツがあるため、エラーとなっています。
http:// のままになっているのは “but requested …” の後に書かれている URL です。
この例では、Google Material Icon のスタイルシートへのリンクと、画像へのリンクが http:// になっています。
Google Material Icon のスタイルシートへのリンクは、<HEAD>セクションに書かれるようにプラグインで設定しているので、修正します。
画像へのリンクは、投稿記事内に書いているので、投稿の編集ページで修正します。
修正すると、エラーの表示はなくなり、 ブラウザの URLバーにも鍵マークがつきます。