AWS for WordPress プラグインを入れて CloudFront を導入してみた。
先日の AWS から WordPress のプラグインがリリースされたと聞いたので、それのプラグインを使って CloudFront を導入してみた話です。
実はこのプラグインはそのリリースより前にあったのですが、今回 CloudFront のワークフローが追加されたということでアップデートされたもののようです。
AWS for WordPress を入れると何がいいの？
凄く簡単に言うと、ページの表示速度が早くなって、大量のアクセスにも耐えられるようになります。さらに自動更新の SSL 証明書が導入されます。これを実現しているのが CloudFront というサービスです。詳細は後ほど説明します。
良いところ
- ページの表示速度が早くなる。
- 大量のアクセスが来てもダウンしない、重くならない。
- SSL 証明書が導入される。
ただし欠点もあります。通信料金が発生します。どのくらいの料金が発生するかは、アクセス数やコンテンツにも依ってきます。
注意したいところ
- 通信料金が掛かるようになる。
つまりはコストとサイトのパフォーマンスとのトレードオフですね。まあアクセス数が増えれば色々と収益もあると思うので大抵の場合プラスになると思います。
CloudFront って
AWS の CDN のサービスです。CDN というのは主に Web サイトのコンテンツを、エッジサーバーと呼ばれる世界各地に配置されたサーバーでキャッシュしてサイトの訪問者に素早くコンテンツを提供出来る仕組みのことです。
CDN がない場合、サイト訪問者のリクエストはサイトのサーバーに送られてそこからレスポンスが返りますが、CDN を導入した場合、世界各地に配置された、訪問者から一番近いエッジサーバーにリクエストが送られそこからレスポンスが返るので、ない場合に比べては早いレスポンスを実現します。
またリクエストが各地のエッジサーバーに拡散するので大量のリクエストも分散処理されるので、サーバーがダウンするようなことが無くなります。
そして SSL 証明書が導入されます。SSL 証明書が導入されると何が良いと言うと Google の検索で上位になりやすくなり、アドレスバーの見栄えが良くなります。
Google の検索の結果は分かりづらいですが、アドレスバーの見栄えは SSL 証明書を入れないと下のよう「保護されていない通信」と表示されてしまいます。ちょっと怖いですよね。
これが SSL 証明書を導入すると下のように鍵マークが付きます。ちょっと安心です。
ただし良い事だけではないです。主に以下2つのことを考慮する必要があります。
- コンテンツの更新
- 通信料金
コンテンツの更新
ページの更新はサイトのサーバーで行いますが、その更新は CDN のエッジサーバーにはすぐには反映されません。つまりサイトを更新したつもりが、訪問者は更新前の内容を見ている可能性があります。
エッジサーバーにあるキャッシュを削除し、更新されたコンテンツをキャッシュさせる必要があります。主に以下２つの対応があると思います。
- すぐに更新する必要が有るのであればエッジサーバーにあるキャッシュを削除する。
- すぐに更新する必要が無いのであればエッジサーバーにあるキャッシュの有効期限が切れるのを待つ。
ただしこのキャッシュ設定ですが、wordpress 側でいい感じに制御してくれています。なので大抵の場合気にする必要がないです。
通信料金
CDN を使うと一般的に通信料金がプラスされます。レンタルサーバーなどは通信料金がサーバー代に含まれている場合がほとんどですが、CDN を入れるとコストが増えてしまいます。
この辺りはサイトのレスポンス向上とのトレードオフですね。
AWS for WordPress プラグインの導入
AWS for WordPress で Cloudfront を使うまでの流れを説明します。主な流れは以下の通りです。
- IAMUser の用意
- AWS for WordPress プラグインのインストール
- AWS for WordPress プラグインの設定
こちらに説明がありますが英語です。なので簡単ではありますが導入方法を説明します。（AWS のアカウントは発行している前提で説明します。）
導入する前に決めること
それは CloudFront を経由してみせるときに使うドメインです。この部分の話です。２つのドメインが必要になります。一つは一部のコンテンツ（主に画像）が CloudFront から配信されるもの、もう一つは全てのコンテンツが CloudFront から配信されるものになります。
- 一部のコンテンツのみ CloudFront から配信
- 全てのコンテンツが CloudFront から配信
いずれも CloudFront から配信されるのでパフォーマンスは向上しますが、当然全てのコンテンツを CloudFront から配信したほうがパフォーマンスは良くなります。ですので「全てのコンテンツが CloudFront から配信」用に割り当てたドメインをメインに公開するのが良いです。
ちなみに当サイトでは以下のように割り当ててます。
- 一部のコンテンツのみ CloudFront から配信：doc-sin.life
- 全てのコンテンツが CloudFront から配信：www.doc-sin.life
AWS for WordPress プラグインのインストール
まずはこの部分、プラグインのインストールは簡単です。普通の wordpress のプラグインとやり方はまったく同じです。
検索ボックスに「AWS for WordPress」と入力し、一番左上に出てくるものをインストールします。
IAMUser の用意
この部分のお話です。プラグインから CloudFront を作るユーザーを作成します。
ここからは AWS マネージメントコンソールでの作業になります。AWS マネージメントコンソールにログインしたら IAM のコンソールを開きます。
左のメニューから「ユーザー」をクリックし、青いボタンの「ユーザーを追加」をクリックします。
「ユーザー名」にユーザーの名前を入力します。なんでも構いません。サイトのドメインと同じでも良いと思います。
ユーザー名を入力したら「プログラムによるアクセス」にチェックを入れます。下の「AWS マネージメントコンソールへのアクセス」は、作成するユーザーで今ログインしている画面に入れるようになるチェックですので今回は必要ないのでチェックは入れないようにしましょう。
チェックを入れたら「次のステップ：アクセス制限」をクリックしましょう。
続いては作成するユーザーにポリシーをアタッチします。ポリシーというのは権限のようなものでプラグインを使う上で必要な権限をユーザーに与えます。
「既存のポリシーを直接アタッチ」をクリックして、検索ボックスに「AWSForWordPressPluginPolicy」と入力します。するとポリシーが検索されるので左にチェックを入れてましょう。
チェックを入れたら「次のステップ：タグ」をクリックしましょう。
あと少しでユーザーの作成は終わりです。ここではユーザーにタグを付けますが、タグの使い方はコツがいるのでここでは飛ばします。何も入力せずに「次のステップ：確認」をクリックしましょう。
最後の確認の画面です。特に確認しておいたいのが、「AWS アクセスの種類」と「アクセス権限の概要」にあるポリシーです。以下のことを確認しましょう。
- 「プログラムによるアクセス – アクセスキーを使用」となっているか。
- 「AWSForWordPressPluginPolicy」がアタッチされているか。
問題がなければ「ユーザーの作成」をクリックしましょう。
無事作成されると下のような画面が出てきます。ただし「閉じる」をクリックしてはいけません。ユーザーの「アクセスキーID」と「シークレットアクセスキー」をメモするか、「.csvのダウンロード」をクリックして csv ファイルをダウンロードしましょう。後ほどプラグインの設定で必要になります。
※ シークレットアクセスキーは、パスワードと同じようなものなので外部に漏れないようにしましょう。
「アクセスキーID」と「シークレットアクセスキー」を控えたら「閉じる」をクリックしましょう。これで IAMUser の作成は完了です。
AWS for WordPress プラグインの設定
続いてはプラグインの設定です。 wordpress の管理画面に戻りましょう。
プラグインのインストールが完了していれば、左のメニューに「AWS」があるはずです。「AWS」-> 「General」とクリックしましょう。
先程のユーザーの作成で控えた「アクセスキーID」と「シークレットアクセスキー」を入力しましょう。「AWS Region」はそのままで大丈夫です。
続いて「AWS」-> 「CloudFront 」とクリックします。
ここで先程決めた２つのドメインを入力します。上の「Origin Domain Name:」が「一部のコンテンツのみ CloudFront から配信」で、下の「www.doc-sin.life」が「全てのコンテンツの CloudFront から配信」になります。
入力したら「Initiate Setup」をクリックしましょう。セットアップが始まります。
セットアップが始まると下のような画面になります。セットアップ中にいくつか実施することがあります。まずは DNS レコードを登録します。ちなみにこの登録は SSL 証明書の発行のために必要な作業になります。
登録する DNS レコードの内容は画面の下にあるものになります。ドメインの DNS にレコードを登録しましょう。レコードを登録したら「Check status of SSL/TLS certifilacat」をクリックしましょう。
暫く経つと次のような画面になります。CloudFront をセットアップしています。このプロセスではやることはないですが、完了までに 20 分程度掛かりますので待ちましょう。
CloudFront のセットアップが完了すると下のようになります。次は DNS レコードの作成です。
画面に表示された通りに DNS レコードを登録しましょう。「Name」は先に入力した「全てのコンテンツの CloudFront から配信」のドメインになります。「Value」は環境によって変わるので注意してください。
DNS レコードの登録が完了したら「Cheak Status of CloudFront DNS record」をクリックしましょう。DNS のレコードがうまく登録出来ていたら下のような画面になります。
最後に「Activate Site Acceleration:」にチェックを入れ、「Save Changes」をクリックします。これで設定は完了です。
CloudFront の無効化
念の為無効化する方法も書いておきます。手順は非常に簡単です。最後にチェックを入れた「Activate Site Acceleration:」のチェックを外し、「Save Changes」をクリックするだけです。