０．はじめに

Kinsta という WordPress のマネージドサービスがあリまして、

で、Kinsta のサービスにも Kinsta CDN という CDN の機能はあるんですが、

あなたのWordPressウェブサイトでKinsta CDNを有効にする方法について

あまり細かい設定は出来ないみたいので、Kinsta CDN ではなく、AWS の CloudFront を利用出来ないか試してみました。

以前、WordPress @ EC2 への CloudFront の適用は、以下の記事にある様にやったことがありましたが、基本的にやり方は同じです。

SSL 化済みの WordPress サイトに CloudFront を適用してみる - Qiita

１． Kinsta 上の WordPress サイトの IP アドレスを確認

Kinsta 側での対応は、基本的に無いんですが、

今回は、Kinsta 上の WordPress サイトに新しいドメインを割り当てておきたかったので、サイトの IP アドレスを確認しておきます。

２． CloudFront が参照するサイトドメインの DNS レコードの設定

以下の DNS レコードの設定を追加する。
- 新 :
  - ???-kinsta.example.com : 　A　XXX.XXX.XXX.XXX
    - XXX.XXX.XXX.XXX は Kinsta で確認したサイトの IP　アドレス

３． CloudFront に新しく Distribution を作成

作成した Distribution での設定項目は、以下。

General

Alternate Domain Names (CNAMEs)
- [サイトドメイン]
- ※ ???.example.com
AWS WAF Web ACL
- ※ 任意
SSL Certificate
- [AWS Certificate Manager で登録した証明書]
- ※ *.example.com
Security Policy
- ※ 任意
- ※ 今回は、諸事情あって TLSv1_2016 を設定
Log Bucket
- ※ 任意
Log Prefix
- ※ 任意
- ※ ???.example.com
Cookie Logging
- ※ 任意

Origins and Origin Groups

Origin Domain Name
- [新しく設定した Kinsta 上の WordPress のサイトドメイン]
- ※ ???-kinsta.example.com
Origin ID
- ※ 自動
Minimum Origin SSL Protocol
- TLSv1.2
- ※ Kinsta は TLS1.2 以上が必須。
Origin Protocol Policy
- ※ 任意
- ※ HTTPS Only

Behavior

`Default (*)` ※ キャッシュする場合の設定

デフォルトでは、原則全てのコンテンツをキャッシュする設定が作成されますが、サイトに合わせて変更して下さい。

Path Pattern
- Default (*)
- ※ デフォルト
Origin or Origin Group
- ※ 作成した「Origins and Origin Groups」を選択
Viewer Protocol Policy
- ※ 任意
- Redirect HTTP to HTTPS
Allowed HTTP Methods
- GET, HEAD, OPTIONS, PUT, POST, PATCH, DELETE
Cache and origin request settings
- Use legacy cache settings
Cache Based on Selected Request Headers
- Whitelist
Whitelist Headers
- CloudFront-Is-Desktop-Viewer
- CloudFront-Is-Mobile-Viewer
- CloudFront-Is-SmartTV-Viewer
- CloudFront-Is-Tablet-Viewer
- Host
- User-agent
Forward Cookies
- Whitelist
Whitelist Cookies
- wordpress_logged_in*
- wp-settings*
Query String Forwarding and Caching
- Forward all, cache based on all

`/wp-admin/` , `.php` ※ キャッシュしない場合の設定

とりあえず、管理者画面などへのアクセス用に追加で設定しました。これも、サイトに合わせて変更して下さい。

※ キャッシュする場合との設定の違いは、以下のみ。

Object Caching : Customize
Minimum TTL : 0
Maximum TTL : 0
Default TTL : 0

４．新しく作成した CloudFront ドメインの DNS レコードの設定

以下の DNS レコードの設定を変更する。
- 旧 :
  - ???.example.com : 　A　XXX.XXX.XXX.XXX
- 新 :
  - ???.example.com : 　CNAME　*************.cloudfront.net
    - ※作成した CloudFront の Domain Name

９９．ハマりポイント

今回は、一度ほぼ同じ対応をしたことがありましたので、特にハマることはありませんでした。

ＸＸ．まとめ

以前は、EC2 で動かしていましたが、今回は、 Kinsta で WordPress を動かす形で、CloudFront を適用してみました。

EC2 に比べて、Kinsta での運用となると、コストは掛かりますが、その分 Kinsta の便利な付加サービスを使えたり、Kinsta 側で補ってくれるメンテナンスやセキュリティ、パフォーマンス、サポートの対応などもありますので、それなりにメリットもあるかなと思います。

さらに、CloudFront を適用すると、Kinsta だけでは出来ないことや、その他の細やかな CDN での対応も出来る様になりますので、結構良いんじゃないかと。

因みに、Kinsta のチャットサポートは、だいたい 5 分以内に返事があるので、非常に使い勝手が良いですよ ♪♪♪

ご参考になれば ♪♪♪

👋👋👋

Kinsta の WordPress に CloudFront を被せてみる