【GCPでWordPress構築】4. https化のためにやること/WebサーバのSSL証明書導入/WordPressのURL変更

サムネイル

本ブログは、GCP(Google Cloud Platform)上にWordPressの仮想インスタンス(サーバ)を立てて運営しています。

この連載では、本ブログを0から構築した時の手順を紹介しています。

GCPって何?という方は次の記事を先に読んでくださいね。

今回は、SSL化を行ってサイトにhttpsでアクセスできるようにします。

この記事でやること

  • https通信をするためには何を設定したらいいかを理解する。
  • WebサーバへSSL証明書を導入する。
  • WordPressのURLをhttpsに変更する。

CloudFlareを介したhttps通信の概要

今回は、CloudFlareを介してhttps通信する場合のSSLの設定を行っていきます。

手順に入る前に、本サイトの構成でhttps通信を可能にする方法を説明します。(CloudFlareを介したSSL設定は先人の記事がたくさんありますが、どんな構成かわかっていないと地味にはまる。)

システム構成のおさらい

下記の記事で説明したように、本ブログはCDNとしてCloudFlare、画像用ストレージとしてGoogle Cloud Storageを使用しています。

CloudFlareを利用しているのはCDNとしての用途以外に、GCSがhttp通信しか受け付けていないことから、CloudFlareを介することでクライアントからのhttps通信を可能にするためです。

なぜCloudFlareを介すればGCSに対するhttps通信が可能になるのか?

GCPはいくつかのCDNサービスプロバイダとCDN Interconnectとして連携しています。CloudFlareもその一つです。連携するプロバイダからはGCSに対するSSL認証が可能になっているものと推測します。

CloudFlareのSSLオプション

CloudFlareには、ブラウザ⇔CloudFlare、CloudFlare⇔オリジンサーバの間でどのような通信を行うかによって、4種類の設定があります。

CloudFlareのSSL設定
オプション暗号化(SSL)の有無ブラウザからの見え方
ブラウザ⇔CloudFlareCloudFlare⇔オリジンサーバ
オフなしなし保護されていない
Flexibleありなし保護されていない
Fullありあり保護されている
Full(strict)ありあり(SSL証明書の有効性を検証)保護されている

どの設定がいいか。結論から言うと「Full(strict)」です。

ブラウザから「保護されていない」とみなされる「オフ」と「Flexible」は論外として、「Full」ではダメな理由としては、GCSとの通信がhttps化されなかったから。一番厳格なstrictモードでないとGCSとのhttps通信はできないらしい。

2021/3/27 追記
Full(Strict)にして運用したところ、証明書が更新できない問題が発生しました。そのため現在は「Full」に切り替えて運用していますが、GCSとのhttps通信で問題は発生していません。

Fullオプションにする場合、

525 エラーを回避するには、Full SSLオプションを有効化する前に、オリジンWebサーバーがHTTPS接続をポート443で許可し、自己署名SSL証明書かCloudflare Origin CA証明書、または認証局から購入した有効な証明書のどれかを提示するように設定します。

とのことなので、Webサーバにも証明書を入れる必要があります。

以上を踏まえて、以降の作業は次の流れで行います。

WebサーバへのSSL証明書導入とWordPressのhttps化設定

CloudFlareの登録と設定

GCSの導入とWordPressとの連携

なお、本サイトはWebサーバにSSL証明書を作成する方法をとっていますが、CloudFlareのCA証明書をサーバに登録する方法でもよさそうです。
その場合は下記の方の記事が参考になると思います。

WebサーバへのSSL証明書導入(Let’sEncrypt)

Let’sEncryptは、無料で使えるSSL証明書です。

前回作成したサーバにLet’sEncryptを使って証明書を作成します。

まずはサーバにSSHで接続しましょう。GCPのCompute Engineのページから、「VMインスタンス」に遷移し、接続の「SSH」をクリックします。

しばらく待つとターミナル画面が表示されます。

ターミナル

下のコマンドでnginxを停止します。

sudo /opt/bitnami/ctlscript.sh stop nginx

次に、下のコマンドで証明書を作成します。

  • Let’sEncryptは証明書作成時にメールアドレスが必要なので適宜用意してください。
  • サブドメインがない場合は最後の「-d」以降は不要です。
sudo /opt/bitnami/letsencrypt/scripts/generate-certificate.sh -m EMAIL-ADDRESS -d YOURDOMAIN -d www.YOURDOMAIN

何か聞かれたら「y」でOKです。

証明書作成

「Congratulations」と出たら成功。

nginxを起動します。

sudo /opt/bitnami/ctlscript.sh start nginx

次に、httpでアクセスされた場合に自動的にhttpsで接続するようにconfファイルを修正します。

sudo vim /opt/bitnami/nginx/conf/bitnami/bitnami.conf

httpのアクセスを設定する箇所で次の行を追加し、httpsにリダイレクトするように設定します。

次の記事でCloudFlareでの常時SSL通信の設定を紹介しています。こちらの方法でも問題ないと思います。)

return 301 https://$host$request_uri;
httpsリダイレクトの設定

設定を再読み込みします。

sudo nginx -s reload

これで証明書の発行とリダイレクトの設定は完了です。

httpでアクセスし、httpsにリダイレクトされることを確認してみてください。

WordPressのURLをhttpsに変更

WordPressでは、サイトのアドレスがデフォルトで下のように設定されています。

(WordPressの管理画面から「設定」>「一般」で確認できます。管理画面のURLは、デフォルトで「http://<ドメイン名>/wp-admin」です。)

URL変更前

これをhttps://~に変更します。
変更しないと記事投稿時にエラーになるらしい。

上記の画面だとグレーアウトして修正できないのでサーバ内のファイルを修正します。

先ほどと同じ手順でターミナルを開き、次のコマンドを入力します。

sudo vim /opt/bitnami/apps/wordpress/htdocs/wp-config.php

アドレスを設定している行を次のように変更します。

変更前
define('WP_SITEURL', 'http://' . $_SERVER['HTTP_HOST'] . '/');
define('WP_HOME', 'http://' . $_SERVER['HTTP_HOST'] . '/');
変更後
define('WP_SITEURL', 'https://' . $_SERVER['HTTP_HOST'] . '/');
define('WP_HOME', 'https://' . $_SERVER['HTTP_HOST'] . '/');
設定ファイル修正

上記を変更したら設定ファイルを再読み込みします。

sudo nginx -s reload

管理画面を更新してアドレスがhttps://~になっていることを確認してください。

URL変更後

おまけ:Bitnamiバナー削除

サイトの右下を見てみるとBitnamiのバナーが出ていると思います。これは設定で削除できるので消しちゃいます。

バナーあり

SSHに接続し、ターミナルを起動したら、次のコマンドを実行してください。

sudo /opt/bitnami/apps/wordpress/bnconfig --disable_banner 1
コマンド

これでページを更新したらバナーが消えているはずです。

バナーなし

今回は以上です。

次回はCloudFlareの登録と設定を行います。

コメント

タイトルとURLをコピーしました