はじめに
当記事はぼくのかんがえたさいきょうのWordpress@AWS環境にて記載している作成手順の
- WordPress入りのLightSailを作成
- Route53にてドメインを取得
- 取得したドメインを元にSSL証明書を発行
- CloudFront構築← ここの手順の詳細です。
- DNSの設定
- セキュリティ対策
手順1のWordpress入りのLightsail
手順2のRoute53にて取得した独自ドメイン
手順3のAWS Certification Managerにて取得したSSL証明書(ワイルドカード証明書)
これらを利用してWordpressサイトを配信するCloudFrontを構築する手順を紹介致します。
手順
AWSにログインし、サービスから「CloudFront」をクリックします。
CloudFrontの管理画面が表示されるので、「Create Distribution」をクリックします。
Webの「Get Started」をクリックします。
CloudFrontの設定画面が表示されるので
下記の表の通りに設定を行う。
Origin Settings
設定項目 | 設定値 |
---|---|
Origin Domain Name | 手順2で取得したドメイン名 |
Origin Path | 空白 |
Origin ID | 自動入力される内容が気に入らなければ変更 |
Minimum Origin SSL Protocol | TLS1.2 |
Origin Protocol Policy | HHTP Only |
Origin Response Timeout | 30 |
Origin Keep-alive Timeout | 5 |
HTTP Port | 80 |
(Origin Custom Headers ) Header | 空白 |
(Origin Custom Headers ) NameValue | 空白 |
Default Cache Behavior Settings
設定項目 | 設定値 |
---|---|
Viewer Protocol Policy | Redirect HTTP to HTTPS |
Allowed HTTP Methods | GET, HEAD |
Field-level Encryption Config | 空白 |
Cached HTTP Methods | No check |
Cache Based on Selected Request Headers | Whitelist |
Whitelist Headers | Authorization CloudFront-Forwarded-Proto Host |
Object Caching | Use Origin Cache Headers |
Forward Cookies | All |
Query String Forwarding and Caching | Forward all, cache based on all |
Smooth Streaming | No |
Restrict Viewer Access(Use Signed URLs or Signed Cookies) | No |
Compress Objects Automatically | No |
Lambda Function Associations | デフォルト空白 |
Distribution Settings
設定項目 | 設定値 |
---|---|
Price Class | Use All Edge Locations (Best Performance) |
AWS WAF Web ACL | None |
Alternate Domain Names (CNAMEs) | 空白 |
SSL Certificate | Default CloudFront Certificate (*.cloudfront.net) |
Supported HTTP Versions | HTTP/2, HTTP/1.1, HTTP/1.0 |
Default Root Object | 空白 |
Logging | Off |
Enable IPv6 | check |
Comment | 空白 |
Distribution State | Enabled |
各種項目の値を設定したらCreateDistributionをクリックする
作成したディストリビューションはStatusが「In Progress」となります。
Statusが「Deployed」になればディストリビューションの作成が完了となります。
これだけでは設定が不十分なので
作成したディストリビューションのIDをクリックして編集画面に遷移します。
ディストリビューションの編集画面に遷移したら上部の「Behaviors」をクリックします。
「Create Behavior」をクリックし、
新規にBehaviorの設定を4つ増やします。
増やす4つの設定は下記の表の通り
※この4つを設定しないとアドオンが動きません。
*.php
設定項目 | 設定値 |
---|---|
Path Pattern | *.php |
Origin or Origin Group | 先程作成したDistributionのOrigin IDを選択 |
Viewer Protocol Policy | Redirect HTTP to HTTPS |
Allowed HTTP Methods | GET, HEAD, OPTIONS, PUT, POST, PATCH, DELETE |
Field-level Encryption Config | 空白 |
Cached HTTP Methods | No check |
Cache Based on Selected Request Headers | Whitelist |
Whitelist Headers | Authorization CloudFront-Forwarded-Proto Host |
Object Caching | Customize |
Minimum TTL | 0 |
Maximum TTL | 0 |
Default TTL | 0 |
Forward Cookies | All |
Query String Forwarding and Caching | Forward all, cache based on all |
Smooth Streaming | No |
Restrict Viewer Access(Use Signed URLs or Signed Cookies) | No |
Compress Objects Automatically | No |
Lambda Function Associations | デフォルト空白 |
/wp-json/*
設定項目 | 設定値 |
---|---|
Path Pattern | /wp-json/* |
Origin or Origin Group | 先程作成したDistributionのOrigin IDを選択 |
Viewer Protocol Policy | Redirect HTTP to HTTPS |
Allowed HTTP Methods | GET, HEAD, OPTIONS, PUT, POST, PATCH, DELETE |
Field-level Encryption Config | 空白 |
Cached HTTP Methods | No check |
Cache Based on Selected Request Headers | Whitelist |
Whitelist Headers | Authorization CloudFront-Forwarded-Proto Host x-wp-nonce |
Object Caching | Customize |
Minimum TTL | 0 |
Maximum TTL | 0 |
Default TTL | 0 |
Forward Cookies | All |
Query String Forwarding and Caching | Forward all, cache based on all |
Smooth Streaming | No |
Restrict Viewer Access(Use Signed URLs or Signed Cookies) | No |
Compress Objects Automatically | No |
Lambda Function Associations | デフォルト空白 |
/wp-admin/*
設定項目 | 設定値 |
---|---|
Path Pattern | /wp-admin/* |
Origin or Origin Group | 先程作成したDistributionのOrigin IDを選択 |
Viewer Protocol Policy | Redirect HTTP to HTTPS |
Allowed HTTP Methods | GET, HEAD, OPTIONS, PUT, POST, PATCH, DELETE |
Field-level Encryption Config | 空白 |
Cached HTTP Methods | No check |
Cache Based on Selected Request Headers | Whitelist |
Whitelist Headers | Authorization CloudFront-Forwarded-Proto Host x-wp-nonce |
Object Caching | Customize |
Minimum TTL | 0 |
Maximum TTL | 0 |
Default TTL | 0 |
Forward Cookies | All |
Query String Forwarding and Caching | Forward all, cache based on all |
Smooth Streaming | No |
Restrict Viewer Access(Use Signed URLs or Signed Cookies) | No |
Compress Objects Automatically | No |
Lambda Function Associations | デフォルト空白 |
/wp-login.php*
設定項目 | 設定値 |
---|---|
Path Pattern | /wp-login.php* |
Origin or Origin Group | 先程作成したDistributionのOrigin IDを選択 |
Viewer Protocol Policy | Redirect HTTP to HTTPS |
Allowed HTTP Methods | GET, HEAD, OPTIONS, PUT, POST, PATCH, DELETE |
Field-level Encryption Config | 空白 |
Cached HTTP Methods | No check |
Cache Based on Selected Request Headers | Whitelist |
Whitelist Headers | Authorization CloudFront-Forwarded-Proto Host |
Object Caching | Customize |
Minimum TTL | 0 |
Maximum TTL | 0 |
Default TTL | 0 |
Forward Cookies | Whitelist |
Whitelist Cookies | comment_author_ wordpress_logged_in_ wordpress_test_cookie wp-settings-* |
Query String Forwarding and Caching | Forward all, cache based on all |
Smooth Streaming | No |
Restrict Viewer Access(Use Signed URLs or Signed Cookies) | No |
Compress Objects Automatically | No |
Lambda Function Associations | デフォルト空白 |
4つ全てを登録したら
合計で5つの設定が下記の図の通りになっている事を確認(この順番が地味に重要なので順番が異なる場合は明細を選択して「Move UP」「Move Down」で順番を整える)
以上でCloudFrontの設定は完了。