いいわけブログ

ガジェット・スニーカー、時々テックな情報お伝えするブログ

AWSのCloudFrontでWordPressを高速化する

      2016/02/07

最近仕事でCloudFrontを使う機会がありました。画像やJS,CSSなどが高負荷の原因となっている事案だったので、そのあたりを回避できないかなぁと
構成はNginx+php-fpmです。WordPress以外でも応用できそうメモ程度に残しておきます。

いろいろとネットを調べると、キャッシュしたいデータをS3にアップロードするパータンのものが多かったのですが、今回はOriginサーバからキャッシュする方法を試して見ました。

キャッシュするオリジンサーバ: iiwake.me
CloudFrontに割り当てるDomain Name: cdn.iiwake.me

・画像ファイルへのリクエスト
[iiwake.me Imageへのリクエスト] -> [cdn.iiwake.meへリダイレクト] -> [CloudFront(キャッシュがあれば返す)] -> [iiwake.me ImageFile]

CloudFrontの設定

CloudFrontを開いて「Create Distribution」ボタンを押す。
cf1
Select delivery methodが表示されるので「Web」を選択して、「Continue」を押す

ディストリビューションの作成、WordPress用にカスタマイズする

cf2
Create distributionが表示されたら各項目に入力していく。※ スクリーンショットの画面は編集画面なので、位置が若干変わってるかもしれません。
また、今回WordPress設定に必要な項目しか書いていませんのであしからず。

Original Settings

cf3
Origin Domain Name ・・・ 元のドメイン名、このブログを参考にしているので仮に「iiwake.me」としています。

Default Cache Behavior Settings

cf4
Viewer Protocol Policy ・・・ 「HTTP and HTTPS」を選択

Allowed HTTP Methods ・・・ 「GET, HEAD, PUT, POST, PATCH, DELETE, OPTIONS」を選択

Forward Cookies ・・・ 「All」を選択

Forward Query Strings ・・・ 「Yes」を選択

Distribution Settings

cf5
Alternate Domain Names (CNAMEs) ・・・ CNAMEを入力する。今回は予めに「cdn.iiwake.me」というサブドメインを入力しておきます。

DNSの設定

cf8
CloudFrontのトップ画面に戻ると、上のようにDistributionsに項目が追加されています。Statusが「InProgress」から「Deployed」に変わるのを待ちましょう。大体20〜30分くらいかかるかもしれません。

cf6
StatusがDeployedになったら、項目を選択してDistributionSettingsを開きます。「General」タブの「Domain Name」を見るとドメインが付与されていることがわかりますね。

cf7
この付与されたドメインを、先ほど設定した「cdn.iiwake.me」というサブドメインのCNAMEに設定します。こちらはお名前.comでの設定後のものです。

サーバ側の設定(Nginx)

以下Nginxの設定です。Locationディレクティブに設定して見ました。もうちょっといい方法がありそうな気もしますが、今回はこれで・・・。

    location / {
        ・・・・・

        set $cloudfront "false";

        if ($http_user_agent = "Amazon CloudFront") {
            set $cloudfront "true";
        }

        if ($cloudfront = "false") {
            rewrite ^.+.(jpg|jpeg|gif|css|png|js|ico)$ http://cdn.iiwake.me$request_uri? last;
        }

        if (-f $request_filename) {
            expires 1d;
            break;
        }

    ・・・・・・・

Apacheの場合も、同じようにリダイレクト設定してあげればいけると思います。

サーバが貧弱で、スケールアウトやスケールアップ考えるのであれば、まずCloudFront試してみるのもありなんじゃないかなぁ。実質のコストで考えると安く済むかもしれません。

 - CloudFront, Nginx, ノウハウ , , ,