お役立ち

ブログをSSL化する(Nginx + php-fpm + WordPress + Let's Encrypt)

  • このエントリーをはてなブックマークに追加

はじめに

SSL/HTTPSとは?

SSLとは暗号技術を用いて、セキュリティ上安全に通信を行う仕組みです。

SSLは次のような目的で開発された通信技術です。

  • 通信傍受を防ぐ
  • 偽サイトへのアクセスを防ぐ

HTTPSとはSSLを使ってHTTP(WEBページの通信)を安全にした仕組みです。

ブログSSL化のメリット

しかし、ブログの場合、通信を傍受されようが偽サイトにアクセスされようが関係ないこともあると思います。

一見、ブログをSSL化するメリットはなさそうですが実は大きなメリットが一つあります。

それは、SEO上のメリットです。

GoogleはSSL化しているWebページを安全なページとして優遇するという発表をしています。

これは、SSL化するだけでライバルのページよりも上位に表示される可能性が高くなるのでチャンスです。フリーブログなどはSSL対応が遅れているところがあるのでWordpress利用者には大きなチャンスです。

Let’s Encryptだと無料で簡単にSSL化

いままで、SSL化を行うのは証明書が有料な上、面倒な作業でした。

しかし、Let’s Encryptは無料な上に公式アプリのcertbotを使うことで簡単にSSL化を行うことができます。

無料ですが、利用者も多く安全でSEO上の恩恵を得ることができます。

具体的な手順

SSL化の大きな流れは次の通りです。証明書とはSSLを利用するための情報が載っているファイルです。
Let’s Encryptだと証明書が無料かつすぐに発行できます。

  1. certbot(Let’s Encryptのクライアント)インストール
  2. SSL証明書の発行
  3. Nginxの設定
  4. https接続確認
  5. ワードプレスの設定
  6. httpリダイレクト設定

certbot(Let’s Encryptのクライアント)インストール

下記のLet’s Encryptのポータルサイトを参考にインストールしてください。
https://letsencrypt.jp/usage/install-certbot.html

SSL証明書の発行

下記のコマンドでcertbot-autoを実行できます。ただし、AWS(Amazon Web Service)上の場合は –debugフラグを付ける必要があります(2018/3/25日時点)。
今回は、”4: Place files in webroot directory (webroot)”を選択します。4を押してEnterを押しましょう。

$ sudo certbot-auto certonly

すると下記のようなメッセージ化表示されます。

Saving debug log to /var/log/letsencrypt/letsencrypt.log
How would you like to authenticate with the ACME CA?
-------------------------------------------------------------------------------
1: Apache Web Server plugin - Beta (apache)
2: Nginx Web Server plugin - Alpha (nginx)
3: Spin up a temporary webserver (standalone)
4: Place files in webroot directory (webroot)
-------------------------------------------------------------------------------
Select the appropriate number [1-4] then [enter] (press 'c' to cancel):

次にドメインを聞かれます。ドメインを下記のように入力(例:www.example.comの場合)してEnterを押しましょう。

Plugins selected: Authenticator webroot, Installer None
Please enter in your domain name(s) (comma and/or space separated)  (Enter 'c'
to cancel): www.example.com

次にアプリのルートフォルダを聞かれるので入力してEnterを押しましょう。

Obtaining a new certificate
Performing the following challenges:
http-01 challenge for www.example.com
Input the webroot for www.example.com: (Enter 'c' to cancel): /var/www/wordpress/

下記のようなメッセージが表示されれば完了です。

Waiting for verification...
Cleaning up challenges
IMPORTANT NOTES:
 - Congratulations! Your certificate and chain have been saved at:
   /etc/letsencrypt/live/www.example.com/fullchain.pem
   Your key file has been saved at:
   /etc/letsencrypt/live/www.example.com/privkey.pem
   Your cert will expire on 2018-06-23. To obtain a new or tweaked
   version of this certificate in the future, simply run certbot-auto
   again. To non-interactively renew *all* of your certificates, run
   "certbot-auto renew"
 - If you like Certbot, please consider supporting our work by:
   Donating to ISRG / Let's Encrypt:   https://letsencrypt.org/donate
   Donating to EFF:                    https://eff.org/donate-le

Nginxの設定

nginxの設定ファイルに下記のような記述を加えましょう。ドメイン名を設定する箇所が3箇所あるので適宜設定してください。

server {
  listen 443;
  ssl_certificate /etc/letsencrypt/live/【ドメイン名(例:www.example.com)】/fullchain.pem;
  ssl_certificate_key /etc/letsencrypt/live/【ドメイン名(例:www.example.com)】/privkey.pem;
  ssl_session_timeout 5m;
  ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
  ssl_ciphers 'ECDHE-RSA-AES128-GCM-SHA256:ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-RSA-AES256-GCM-SHA384:ECDHE-ECDSA-AES256-GCM-SHA384:DHE-RSA-AES128-GCM-SHA256:DHE-DSS-AES128-GCM-SHA256:kEDH+AESGCM:ECDHE-RSA-AES128-SHA256:ECDHE-ECDSA-AES128-SHA256:ECDHE-RSA-AES128-SHA:ECDHE-ECDSA-AES128-SHA:ECDHE-RSA-AES256-SHA384:ECDHE-ECDSA-AES256-SHA384:ECDHE-RSA-AES256-SHA:ECDHE-ECDSA-AES256-SHA:DHE-RSA-AES128-SHA256:DHE-RSA-AES128-SHA:DHE-DSS-AES128-SHA256:DHE-RSA-AES256-SHA256:DHE-DSS-AES256-SHA:DHE-RSA-AES256-SHA:AES128-GCM-SHA256:AES256-GCM-SHA384:AES128-SHA256:AES256-SHA256:AES128-SHA:AES256-SHA:AES:CAMELLIA:DES-CBC3-SHA:!aNULL:!eNULL:!EXPORT:!DES:!RC4:!MD5:!PSK:!aECDH:!EDH-DSS-DES-CBC3-SHA:!EDH-RSA-DES-CBC3-SHA:!KRB5-DES-CBC3-SHA';
  ssl_prefer_server_ciphers on;
  ssl_session_cache shared:SSL:10m;
  server_name 【ドメイン名(例:www.example.com)】;
  index index.php;
  root /var/www/wordpress;
  location ~* /wp-config.php {
       deny all;
  }
  location ~ \.php$ {
      fastcgi_pass   127.0.0.1:9000;
      fastcgi_index  index.php;
      fastcgi_param  SCRIPT_FILENAME  $document_root$fastcgi_script_name;
      include        fastcgi_params;
  }
  location @wordpress {
      # HTTP headers
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_set_header Host $http_host;
      proxy_set_header X-Forwarded-SSL on;
      proxy_set_header X-Forwarded-Proto $scheme;
      proxy_redirect off;
      proxy_pass http://app_server;
      fastcgi_pass 127.0.0.1:9000;
      fastcgi_index index.php;
      fastcgi_split_path_info ^(.+\.php)(.*)$;
      fastcgi_param SCRIPT_FILENAME $document_root/index.php;
      include fastcgi_params;
  }
  location / {
      try_files $uri $uri/ @wordpress;
  }
}

設定が完了したらNginxを再起動しましょう。

service nginx restart

https接続確認

Httpsの設定が反映されているか確認しましょう。ブラウザを開いてhttpsを付けてブログにアクセスしましょう。

ワードプレスの設定

無事、Httpsでアクセスできることが確認できたらワードプレスのほうの設定を行います。
ワードプレスのダッシュボードにアクセスして、アドレスをhttpからhttpsに書き換えましょう。
サイドバーの設定一般から設定画面に進みます。下記のようにWordpressとサイトのアドレスのhttpをhttpsにして、ページ下部の「変更を保存」をクリックすると設定が完了します。

httpリダイレクト設定

次にHTTPでアクセスしたらHTTPSにリダイレクトする設定を加えましょう。Nginxの設定ファイルに元々書いてある、Httpの設定を下記のように書き換えます。

server {
  listen 80;
  server_name 【ドメイン名(例:www.example.com)】;
  return 301 https://$host$request_uri;
}

httpでアクセスしたらhttpsになっていることが確認できると思います。

完璧なSSL化

これでSSL化が完了しましたが、まだ完璧ではありません。なぜなら、サイト内のリンクをHTTPSへ変更する必要があるからです。
この変更作業はhttpのリンクを逐次置き換える必要があり面倒です。Wordpressのプラグインを使えば置き換えが可能です。
とはいえ、SEO上は完璧なSSL化をしなくても大丈夫だという見解なので今回はこのままでにしておきます。

  • このエントリーをはてなブックマークに追加