wordpressサイト、SSL化の戦い
こんにちは永田です。
今回は当社のサイトの常時SSL化への作業をまとめてみようと思います。
まずサイトの常時SSL化（https）によって、
- Webサイトの信頼性の向上
- 通信速度向上
- 盗聴・なりすましを防ぐ
などなどいろんなメリットがあります。いままでは銀行やECサイトなどの取引サイトだけが常時SSLに対応していましたが、それ以外のサイトでも常時SSL化を！とGoogleさんが推奨しているということで、現在着実に常時SSL対応サイトが増えてきています。また、SEOの評価も高まるようです（逆に対応してないと悪影響…？）。
当社のサイトも常時SSLに対応している…のですが、Firefoxで閲覧した際に
これ
警告マークが出ちゃってます。
詳細をみると、
「このページの一部（画像など）は安全ではありません」
…とのこと。
どうも、画像のURLが「http:～」から始まる絶対パスで指定されているせいで「http」と「https」、二つのプロトコルが混在したコンテンツとなり警告が出ているようです。
対処としてはfunctions.phpに、
/*
メディアアップロードした画像のURLのドメイン部分を消す
*/
function delete_host_from_attachment_url( $url ) {
$regex = '/^http(s)?:\/\/[^\/\s]+(.*)$/';
if ( preg_match( $regex, $url, $m ) ) {
$url = $m[2];
}
return $url;
}
add_filter( 'wp_get_attachment_url', 'delete_host_from_attachment_url' );
と追加してあげると、メディアが自動的に相対パス（プロトコルが表記されていない）でアップロードされるようになります。
その他、直接リンク指定している箇所（テンプレートとか…）を地道に検索し、「http://www.●●～」を「//www.●●～」と修正します。
プロトコル部分を省いた表記にすることでブラウザの方で自動的に、表示ページのURLのプロトコルに合わせてリンク先を見てくれるようになります。
さて全画面の画像のリンク修正も終わり完全にSSL化できたかと思いきや…
…(^-^;
今度は黄色ではなくグレーの警告になりました。
黄色よりは目立たないし危機感はなさそうな感じとはいえ警告は警告ですので対処します。
詳細を見たところ、
「このページが安全でないためFirefoxがブロックしました」
どうも外部cssやらなんやらのURLにhttp表記が混じっているようです。
画像だけでなく、外部から読み込むリソース （CSS、JavaScriptなど）もhttpsで配信されていなければならないんですね（めんどくさい）。
ソースを表示し、検索してみると三つほどhttp表記が。
まず一つ目。
＜head＞内に
＜link rel="pingback" href="https://www.kuzilla.co.jp/xmlrpc.php" /＞
こんな記述が。
そもそもpingback機能は「Disable XML-RPC Pingback」プラグインで無効化してるのでこの記述自体不要です。
ということでheader.phpから表記自体を削除。
そして二つ目。
Google Web Fontsのリンクでhttp表記が。
＜link href="http://fonts.googleapis.com/css～略＞
これも上記と同じくheader.phpでプロトコル部分を削除。
ラスト！
ソーシャル部のはてなブックマークへの追加ボタンのJavascriptへのリンク部にも地味～～に紛れてこんでおりました。
これもプロトコル部分を削除。
すると…
やったね！
綺麗な鍵アイコンになりました。
Wordpressの構造上、修正するのがちょっとややこしく時間を取られてしまいました。。
今後１からサイトを作る際はしっかり常時SSL化を意識して作成していこうと思いましたまる
ではこの辺で！