AWSのEC2に設置したWordPressサイトをALBとACMの証明書を使ってhttps対応(SSL化)する案件を対応したため、メモ代わりに紹介いたします。
今回は、EC2の初期構築やALBとEC2の接続の部分ではなく、
- Route53の設定
- .htaccessの設定
- WP内のパスをhttps化
- wp-configの設定
を紹介します。
※EC2の初期構築やALBとEC2の接続はググればたくさん情報が出てきて困らなかったため。
Route53の設定
Route53の設定は非常に簡単で、
- 接続するドメイン名のHost Zoneを作成
- そのHost ZoneのwwwなしのRecord Setを取得したドメインのネームサーバーに設定
- wwwありのRecord Setを作成
- wwwありのRecord SetにACMの証明書をくっつけたALBを接続(Alias Targeに設定)
すれば、接続したドメインでALBで管理するサイトにアクセスできるようになります。
ただ、この時点だと、
- http://www.●●.com
- http://●●.com
- https://www.●●.com
- https://●●.com
全てでアクセスできてしまうため、.htaccessを変更して、https://●●.comに統一しました。
.htaccessの設定
|
1 2 3 4 5 6 7 8 9 10 |
<IfModule mod_rewrite.c> RewriteEngine On RewriteBase / RewriteRule ^index\.php$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . /index.php [L] RewriteCond %{HTTP:X-Forwarded-Proto} !=https RewriteRule ^/?(.*) https://%{HTTP_HOST}/$1 [R,L] </IfModule> |
この変更で、
- http://www.●●.com
- http://●●.com
- https://www.●●.com
- https://●●.com
すべてのアクセスを【https://●●.com】に集中させることができます。
リダイレクトループ(無限ループ)させないために
WordPressのdefaultの.htaccessに追加したのは
|
1 2 |
RewriteCond %{HTTP:X-Forwarded-Proto} !=https RewriteRule ^/?(.*) https://%{HTTP_HOST}/$1 [R,L] |
この2行です。
.htaccessを利用したリダイレクトには様々な記述法があります。
しかし、AWSのALBを使う場合、この記述法にしないと、リダイレクトループ(無限ループ)が発生して、ブラウザが正常にサイトを表示しなくなります。
WP内のパスをhttps化
サイトのドメインをhttps化できても、そのサイトで使っている
- 画像パス
- cssのファイルパス
- javascriptのファイルパス
がhttpで通信をしていると、保護されていない通信になってしまいます。
わたしが作成したサイトでは以下の対応をしてhttp通信しているパスをhttps化しました。
DBにhttpで登録されている文字列をhttpsに変更する
特にウィジェット等使っていない簡易的なサイトだったので、
- mysql ダンプ(mysqldump -uユーザー名 -p dbname > dump.sql)
- http→httpsに変更
- 登録
して、パスをすべてhttps化しました。
※ウィジェット等を使っているWPサイトの場合、https化用のツールを使う必要があります。
httpで出力してしまうwpタグをhttps対応する
【bloginfo(‘template_directory’)】
こういったタグはhttp://でパスを出力してしまいます。そのため、
【ltrim(get_bloginfo(‘template_directory’), ‘https:’)】
上記のように変更して、https対応をします。
WordPressが自動で生成するソースを削除する
WordPressが自動で生成するソースにもhttp通信のものが含まれています。
それらを出力しないようにするために、以下の記述をfunctions.phpに追加します。
■絵文字を解釈するためのソースを無効化
|
1 2 |
remove_action('wp_head', 'print_emoji_detection_script', 7 ); remove_action('wp_print_styles', 'print_emoji_styles'); |
■Embed機能用のソースを無効化
|
1 2 3 |
remove_action('wp_head','rest_output_link_wp_head'); remove_action('wp_head','wp_oembed_add_discovery_links'); remove_action('wp_head','wp_oembed_add_host_js'); |
wp-configの編集
最後にwp-configを編集します。
https化した後にwp-configを編集しないと、wp-adminの管理画面で「このページにアクセスする権限がありません。」という文言が出て、記事の編集ができなくなります。
その状態を回避するために、wp-config.phpに
|
1 2 |
$_SERVER['HTTPS'] = 'on'; $_ENV['HTTPS'] = 'on'; |
を追記します。
注意点として、
|
1 |
require_once(ABSPATH . 'wp-settings.php'); |
より手前に記述してください。
こうすると、https状態で管理画面にログインできるようになります。
思った以上に大変だったALBを使ったWPサイトの運用
XSERVERやロリポップなら簡単にSSL化できたWordPressサイトだったのですが、AWSのALBとACMを使うという案件だったので少々時間がかかってしまいました。
もし同じような状況の方がいらっしゃいましたら、是非、参考にしてください！
