CDN をどれ使おうかと色々試してみる中で勉強がてらAmazon CloudFrontのCDNとWordpressを組み合わせて使ってみることにした。

 

CDNの種類

[table id=19 /]

 

 

CloudFront CDN

Amazon AWSのCDN、従量課金制で別ドメイン型である。
リクエスト数だけで見ると料金は安いがページの容量が大きかったりすると一気に料金が跳ね上がる。
画像の容量を抑え、CSSなどはインライン化とかしてリクエスト数を減らせば料金も抑えられると思う。
HTTPSで運用しているサイトは、HTTPSで配信する必要性がある。

 

 

CloudFrontの設定

証明書のアップロード

初めてCloudFrontを使ったわけですが証明書のアップロードが面倒くさいです。
Web上からできないのでコマンドラインから証明書をアップデートする必要性があります。
参考　http://qiita.com/n0bisuke/items/a2a7d5efdc1311dc479a

なおCDN用に証明書を用意できないので今回はデフォルトの証明書を使います。

 

CloudFrontの設定

イメージ図的にはこんな感じであってるのだと思う。draw.io 便利〜
HTTPSでサーバーを動かしてるときには 同じくHTTPSでCDNから転送しないと主要ブラウザではエラーを吐いてレイアウトが崩れて表示されてしまいます。

 

General

Default CloudFront Certificate (*.cloudfront.net)　にチェックをつけます。
独自ドメインでCDN配信するにはまた工程が増えるのでこのまま使うことをオススメします。

 

Origins

Originの設定です。
今回はHTTPSでしか配信を行わないので Origin Protocol Policy は HTTPS Only にします。

 

Behaviors

特に記述することもなく。

 

ログイン画面、管理画面でキャッシュさせないように上記のような設定をします。
Path Patternに関して私の環境では /wordpress を付けてます。

 

 

Behavioursの設定は上記のようになると思います。

 

WordPressの設定

WordPressアドレス（URL) : https://から割り当てられたアドレス>/wordpress
サイトアドレス : https://luispc.com
とします。

 

これで画像を開いてみるとCloudFrontアドレスになっていると思います。