さくらのレンタルサーバー上のWordPressの常時SSL化でハマりまくったのでシェアしておきます

目次

• サーバー環境やWordPressについて
• bloginfo(‘template_url’)とbloginfo(‘url’)の修正
• さくらのレンタルサーバー特有の設定
• プラグインが書き出すスクリプトのURL
• 画像URLの一括書き換え
• リダイレクトがうまくいかない

bloginfo(‘template_url’)とbloginfo(‘url’)の修正

まず、自作テーマで使っていたbloginfo('template_url')とbloginfo('url')がhttpsを返さないという問題に出くわしました。そもそも非推奨になっている関数 だそうで、推奨されるget_template_directory_uri()に変更しました。

たとえば、CSSの読み込み部分を以下のように変更しました。

Before

<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/style.min.css?v=201711150615">

After

<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/style.min.css?v=201711150615">

ところが、get_template_directory_uri()を使っても、なぜかhttpsを返さないんですね。調べたら、さくらのレンタルサーバー特有の設定が必要だというのがわかりました。

プラグインが書き出すスクリプトのURL

上の設定を完了して「よし、これで常時SSLだ！」と思ったら、Chromeのロックアイコンが緑になりません。。。

開発者ツールで確認したら、まだhttpからリソースが読み込まれているとのこと。たしかにソースコードを見てみると、以下のように、いくつかスクリプトがhttpから読み込まれていました。

<script type="text/javascript" src="http://parashuto.com/rriver/wp/wp-includes/js/jquery/jquery.js?ver=1.12.4"></script>
<script type="text/javascript" src="http://parashuto.com/rriver/wp/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.4.1"></script>

以下の解決策を考えたんですが、結局、当面は3つ目の強引に書き換える方法をとりました。

1. httpを書き出しているプラグインを見つけて停止、または修正する
2. SSL化プラグインを入れる
3. 書き出されているhttpをhttpsに書き換える

wp_head()とwp_footer()の書き換え

ソースコードを見るとwp_head()とwp_footer()で書き出している部分でhttpでJavaScriptを参照しているので、この部分を以下のように書き換えました。

無駄なサーバーリソースの使い方なような気がするので、問題のプラグインを特定できたら元に戻そうと思っています。

wp_head()

<?php
ob_start();
wp_head();
$wp_head_contents = ob_get_clean();
$wp_head_contents = str_replace('http://', 'https://', $wp_head_contents);
echo($wp_head_contents);
?>

wp_footer()

<?php
ob_start();
wp_footer();
$wp_footer_contents = ob_get_clean();
$wp_footer_contents = str_replace('http://', 'https://', $wp_footer_contents);
echo($wp_footer_contents);
?>

ちなみに、この設定については以下のサイトを参照させていただきました。

• SSL化した時のwp_headとwp_footerについて

JetPackが悪さをしている？

その後、試しに必要なさそうなプラグインを停止してみたら、どうやらhttpでJavaScriptを参照しているのはJetPackプラグインでした。「JetPack https 」で検索すると、今回の件とは別ですが、さくらのレンタルサーバーの環境でいくつか問題があるようなので、その辺に関わる問題があるのかもしれません。

僕の場合、どちらにしてもJetPackは活用できていなかったので、とりあえず停止しておきました。このJetPack、なぜか、かなりの数のJSリソースをぶち込んでくるみたいですし。。。

リダイレクトがうまくいかない

検索したら出てくるいくつかのサイトにあるように、.htaccessにリダイレクトの設定を書き込めば良さそうなんですが、僕の環境の場合、どうしてもエラーが出てしまってダメでした。なんでなんだろう？

.htaccessの記述を晒しちゃいますけど…

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /rriver/
RewriteRule ^index.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /rriver/index.php [L]
</IfModule>

この記述の上に以下のリダイレクトのルールを追加すると「ERR_TOO_MANY_REDIRECTS」というエラーが出てページが表示されなくなってしまいます。

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>

このあたりの情報 がヒントになるかな。。。

仕方がないので、このサイト で紹介されているように、以下をfunctions.phpに追加して対処しました。

function force_https_redirect() {
 if ( !is_ssl() ) {
 wp_redirect( 'https://' . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'], 301 );
 }
}
add_action ( 'template_redirect', 'force_https_redirect', 1 );