【ConoHa × KUSANAGI × Cloudflare】セキュアで高速なWordPressを作ろう

この記事は、以下の記事の続きです。

契約、セキュリティ設定、そしていよいよWordPress構築です。

そのままWordPressを構築してもよいのですが、無料で高度な機能がいくつも使える「Cloudflare」というWebサービスも導入してみます。

以下のような機能を無料で使えちゃうすごいサービスです。

  • DDoS攻撃対策
  • DNSサーバー
  • リバースプロキシ
  • 共用SSL化(独自ドメイン可)
  • CDN(コンテンツ配信ネットワーク)
  • ドメインレジストラ

 

ドメインレジストラについてはこの記事では使いません。後日別記事で解説します。


この記事ではWordPressの立ち上げを中心に説明しますので、ドメインの取得やCloudflareへの登録は先に行っておいてください。

この記事を読む前にやること
  • KUSANAGIサーバーの構築とセキュリティ設定(上記2記事参照)
  • ドメインの取得
  • Cloudflareのアカウント作成とドメインの登録

 

DNSレコードの登録

Cloudflareダッシュボードを開きます。

 

1つのアカウントで複数のドメインを管理している場合は、使用したいドメインを選びます。

 

ページ上部メニューの「DNS」を選択します。

 

まずCloudflareのネットワークを通さず、直接サーバーにアクセスするためのDNSレコードを登録します。
パラメータを入力して「Add Record」をクリックします。

ConoHaコントロールパネルを開きます。

 

「詳細情報」をクリックします。

 

「IPアドレス」欄や、上部のホスト名の横などにIPアドレスが表示されます。
「IPアドレス」欄の右側にあるアイコンをクリックするとIPアドレスをコピーできます。


補足
サーバーのIPアドレスを安易に取得されないよう、推測されにくいホスト名にすることをおすすめします。
パラメータ
  • Type:A
  • Name:ホスト名
    (example.comというドメインを持っていて、hostname.example.comとしたい場合は「hostname」、サブドメインを使用したくない場合は「@」)
  • IPv4 address:サーバーのIPアドレス
  • TTL:Automatic TTL
  • 雲のアイコン:灰色
    (DNS機能のみを使います)

 

次に、WordPressのサイトで利用するドメインのDNSレコードを登録します。
以下のパラメータを入力して「Add Record」をクリックします。

パラメータ
  • Type:CNAME
  • Name:ホスト名
  • Domain name:先程登録したドメイン
    (example.comというドメインを持っていて、ホスト名を「hostname」にした場合、「hostname.example.com」)
  • TTL:Automatic TTL
  • 雲のアイコン:オレンジ色
    (CDNやDDoS対策を使います)

 

レコードが追加されれば完了です。

SSLの設定

VPSにログイン

あらかじめConoHaコントロールパネルのコンソールか、SSH経由でVPSにログインしておきます。

 

証明書の取得・設置

VPS-Cloudflare間の暗号化を行うための証明書を発行し、設置します。

 

Cloudflare上部のメニューから、「Crypto」をクリックします。
SSLのモードを「Full (strict)」に設定します。

Cloudflareの通信暗号化には4種類のモードがあります。

OFF

通信経路を一切暗号化せず、すべてhttpで通信します。推奨されません。

Flexible

閲覧者-Cloudflare間を暗号化し、サーバー-Cloudflare間は暗号化しません。
サーバー側の操作がほとんど必要ないため、手軽にサイトをhttps化できます。
ただし、サーバー-Cloudflare間は情報が暗号化されずにインターネット上を流れるため、
認証を必要とするサイトや、フォームなどで個人情報を送受信するサイトには推奨されません。

Full

通信経路をすべて暗号化します。
サーバー-Cloudflare間において証明書検証は行われないため、自己署名証明書(オレオレ証明書)やLet’s Encryptなどで取得した証明書を使用できます。

Full (strict)

通信経路をすべて暗号化します。
サーバー-Cloudflare間において、予め自分で用意した証明書、あるいはCloudflareで発行した証明書を用いて通信します。
サーバーが正規のものであるか確認することができるため、DNSキャッシュポイズニング攻撃や、フィッシング詐欺への対策ができます。


下へスクロールし、Origin Certificatesの「Create Certificate」をクリックします。

 

Private key type(鍵の種類)を「ECDSA」、Certificate Validity(証明書の有効期間)を自分が設定したい長さ(最長15年間)に設定して「Next」をクリックします。

 

公開鍵が表示されます。これをサーバーに設置していきます。
以下のコマンドを実行して、先程の公開鍵をファイルに保存します。

シェル
# vim /etc/pki/tls/certs/cloudflare.crt

 

公開鍵の下に、秘密鍵が表示されているので、同様にサーバーに設置していきます。

注意
秘密鍵は、一度ウィンドウを閉じると再表示できません。 誤って閉じた場合は、鍵の生成からやり直してください。
シェル
# vim /etc/pki/tls/private/cloudflare.key

 

鍵のパーミッションを変更します。

シェル
# chmod 400 /etc/pki/tls/private/cloudflare.key
# chmod 400 /etc/pki/tls/certs/cloudflare.crt

その他Cloudflareの設定

以下の設定は必須ではありませんが、「ON」にしておくことをおすすめします。

 

Always Use HTTPSを「ON」にすると、全てのhttpリクエストをhttpsにリダイレクトしてくれます。

 

Automatic HTTPS Rewritesを「ON」にすると、ウェブサイト上の”http”で書かれたリンクを”https”に置換してくれます。

WordPressの構築

プロビジョニング

いよいよWordPressの構築を行っていきます。
本来であれば、データベースやWebサーバー、phpの設定やWordPressの設置など、非常に多くの手順が必要になりますが、
KUSANAGIは対話形式で必要な情報を入力していくだけで、自動で環境を構築してくれます。めっちゃ便利。

以下のコマンドを実行して、必要な情報を入力していきます。
ここではプロファイル名を「dotslash」としています。自分のわかりやすいものを設定しましょう。

シェル
# kusanagi provision dotslash
ターゲットディレクトリは /home/kusanagi/dotslash に変更されました。

 

まず使用する言語を選択します。日本語を使用するので、「2」を入力します。

kusanagi provision
WordPress のインストールで使用する言語を選択してください。
1 : en_US
2 : ja

q : 終了

どれを使用しますか?:  2

ja を選択しました

 

サイトで使用したいFQDN(ドメイン)を入力します。
CloudflareのDNSレコード登録の際に決めたドメインを入力します。

kusanagi provision
Webサイトで使用するホスト名(FQDN)を入力してください。 例) kusanagi.tokyo
dotslash.cardias.net
Webサイトで使用するホスト名(FQDN)をもう一度入力してください。
dotslash.cardias.net

 

Let’s Encryptの設定です。今回はCloudflareの証明書を使用するので、取得の手順をスキップします。
何も入力せずにEnterを2回入力します。

kusanagi provision
Let's Encryptを使用される場合、Let's Encrypt の使用規約に同意される必要があります。
使用規約に同意される場合、あなたのメールアドレスを入力してください。同意されない場合、Enterキーを二回押してください。
使用規約は次のURLより確認できます: https://letsencrypt.org/repository/
(何も入力せずにEnter)
メールアドレスを再入力してください。
(何も入力せずにEnter)

 

WordPressで使用するデータベース名を入力します。

kusanagi provision
データベース名を入力してください。
dotslash
データベース名を再度入力してください。
dotslash

 

データベースに接続する際に利用するDBユーザー名を入力します。
※ここではデータベース名とユーザー名を同じにしていますが、混同しないようにしましょう。

kusanagi provision
dotslash のユーザー名を入力してください。
dotslash
dotslash のユーザー名を再度入力してください。
dotslash

 

DBユーザーのパスワードを設定します。※最低8文字
英数と一部の記号.!#%+_-が使用できます。

補足
入力したパスワードは画面に表示されません。
kusanagi provision
データベースユーザ'dotslash'のパスワードを入力してください。[a-zA-Z0-9.!#%+_-]の文字列が使用できます。最小は8文字以上です。
再度 'dotslash' のパスワードを入力してください。

 

自動でWordPressのダウンロードと構築が始まります。
「完了しました。」と表示されれば完了です。

kusanagi provision
--2019-03-07 01:35:55--  https://ja.wordpress.org/latest-ja.tar.gz
ja.wordpress.org (ja.wordpress.org) をDNSに問いあわせています... 198.143.164.252
ja.wordpress.org (ja.wordpress.org)|198.143.164.252|:443 に接続しています... 接続しました。
HTTP による接続要求を送信しました、応答を待っています... 200 OK
長さ: 11268474 (11M) [application/octet-stream]
`wordpress.tar.gz' に保存中

100%[=================================================================================================================================>] 11,268,474  5.84MB/s 時間 1.8s

2019-03-07 01:35:57 (5.84 MB/s) - `wordpress.tar.gz' へ保存完了 [11268474/11268474]

dotslash のプロビジョニングは完了しました。dotslash.cardias.net にアクセスし、WordPressをインストールしてください!
完了しました。

SSL証明書設定変更

Cloudflareの証明書を使用するための設定を行います。

Nginxのコンフィグファイルを開きます。

シェル
# vim /etc/nginx/conf.d/{プロファイル名}_ssl.conf

 

内容を書き換えます。

dotslash_ssl.conf
ssl_certificate /etc/pki/tls/certs/localhost.crt;
ssl_certificate_key /etc/pki/tls/private/localhost.key;
↓コメントアウト
#ssl_certificate      /etc/pki/tls/certs/localhost.crt;
#ssl_certificate_key  /etc/pki/tls/private/localhost.key;

#追記
ssl_certificate      /etc/pki/tls/certs/cloudflare.crt;
ssl_certificate_key  /etc/pki/tls/private/cloudflare.key;

 

kusanagiを再起動します。

シェル
# kusanagi restart

WordPressの初期設定

ブラウザから「https://サイトのFQDN/」にアクセスします。
(例:https://dotslash.cardias.net/)

 

httpsでアクセスされ、エラーが出ていないことを確認して「さあ、始めましょう!」をクリックします。

 

データベース名、ユーザー名、パスワードに先程kusanagi provisionコマンドで設定したものを入力し「送信」をクリックします。

 

入力した内容が間違っていなければ、画像のような表示になります。「インストール実行」をクリックします。

 

サイトに関連する情報を入力して、「WordPressをインストール」をクリックします。
ユーザー名とパスワードはサイトにログインするときに使用します。

注意
ユーザー名に推測されやすいもの(admin、administrator、webmasterなど)を設定しないようにしましょう。

 

これでインストールは完了です。「ログイン」をクリックします。

 

インストール時に入力したユーザー名、パスワードを入力して「ログイン」をクリックします。

 

セキュリティ・更新・キャッシュ設定

ダッシュボードの「セキュリティ状況」に、変更すべきセキュリティ項目が表示されています。
これらの問題を解決し、さらにプラグインやテーマの自動更新が行えるよう設定を行います。

以下のコマンドを実行します。

シェル
# cd ~kusanagi/dotslash/DocumentRoot/
# mv wp-config.php ..
# chmod 0755 wp-content/
# cd ..
# chown kusanagi.www wp-config.php

 

コンフィグファイルを書き換えます。

シェル
# vim wp-config.php
補足
FTP_PASSに設定するのは、VPSを構築した際、kusanagi initコマンドで設定したkusanagiユーザーのパスワードです。
WordPressサイトのパスワードや、DBのパスワードではありません。
wp-config.php
#define('FTP_PASS', '*****');
↓コメントアウトをはずす
define('FTP_PASS', '{kusanagiユーザーのパスワード}');

 

パーミッションを変更します。

シェル
# chmod 0440 wp-config.php

 

KUSANAGIのキャッシュ機能を有効化します。

シェル
# kusanagi fcache on
# kusanagi bcache on

 

KUSANAGIプラグインの設定

ブラウザに戻り、左側のメニューから「KUSANAGI」を選択します。

 

上部メニューから「自動更新」をクリックし、自分に合った自動更新設定に変更します。
よくわからない場合はそのままにしておきましょう。

 

「翻訳アクセラレーター」をクリックし、サイトに表示される翻訳された文章を「キャッシュを使用」に変更して「変更を保存」をクリックします。

 

必要であれば、「画像最適化」のページから画像最適化を有効化します。

Cloudflareプラグインの設定

CloudflareとWordPressを連携させるのに便利な「Cloudflare」プラグインをインストールします。

左側のメニューから、「プラグイン」→「新規追加」をクリックし、
キーワードに「cloudflare」と入力します。
候補に「Cloudflare」が出てきたら、「今すぐインストール」をクリックします。
(他のプラグインと間違えないように注意してください。)

 

インストールが完了したら、「有効化」をクリックします。

 

メニューから「設定」→「Cloudflare」をクリックします。
「Have an account already? Sign in here.」の「here.」をクリックします。

 

メールアドレスとAPIキーを入力する画面が表示されます。
「Get your API Key from here.」の「here.」をクリックします。

 

ポップアップが表示されるので、ログインします。
下にスクロールと「API Keys」の欄があるので、Global API Keyの「View」をクリックします。

 

Cloudflareのアカウントのパスワードを入力してI’m not a robotの横のチェックボックスをクリックします。

 

表示がに変わったら、「View」をクリックします。

 

APIキーが表示されるのでコピーします。

 

WordPressに戻り、メールアドレスと先程コピーしたAPIキーを入力して「Save API Credentials」をクリックします。
これで様々な設定が管理できるようになります。

 

Optimize Cloudflare for WordPressの「Apply」をクリックします。
Cloudflareに対して、WordPress向けの設定が自動的に適用されます。
適用される設定項目は下記参照。

参考 What settings are applied when I click 'Optimize Cloudflare for WordPress' in Cloudflare's WordPress plugin?Cloudflare Support

 

ページ下に「Your default settings have been successfully set.」と表示されればOKです。

 

Automatic Cache ManagementをONにすると、記事を公開したときに自動的にキャッシュをパージしてくれます。
スイッチ部をクリックします。

 

「I’m sure」をクリックすると有効化されます。

速度検証

他にもいろいろプラグインを入れたりした状態ですが、この記事を書いた時点での分析サイトのスコアを載せておきます。

PageSpeed Insights

モバイルは要改善ですね。

GTmetrix

おわり!

ConoHa VPS × KUSANAGI × Cloudflareという組み合わせでWordPressの構築をやってみました。

思ったより長くなったな・・・という印象ですが、
鯖機を自分で用意して、チューニングも1からやって、WordPressの設定をやって・・・
ということをしていると、これの何倍何十倍もの時間と労力がかかります。

自分専用のサーバーを持ってみたい!爆速なWordPressでサイトが作りたい!
という方は是非チャレンジしてみてください。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です