WordPressのメディアをAWSのS3で配信するウェブサイトで、
HTTPSに対応してみました。（備忘録）
参考にさせていただきました。感謝。m(..)m
WordPressサイトをCloudFrontで配信する
Dot TKで取得した無料ドメインをRoute 53でホストする
【無料&超簡単】S3と独自ドメインで公開しているサイトをSSL(https)化する
AWS CloudFrontを使ってWordPressのメディアファイルだけS3に配置する
案外簡単なAWS上のWordPressのSSL化
以下、AWSのEC2+RDS+S3でWordPressが動いている前提です。
example.comを独自ドメインに読みかえてください。
作業の途中でWordPressのサイトが見えなくなったり、ダッシュボードにログインできなくなったりすることがあります。sshでec2インスタンスにログインして、wp-config.phpが編集できる状態にしておくと良いと思います。
Route 53の設定
Route 53コンソールを開く。
「Create Hosted Zone」
Domain Name: example.com
Comment: （適宜入力）
Type: Public Hosted Zone（デフォルト）
「Create」して表示されるNSレコードを、独自ドメイン（契約サービス）のDNSとして設定する。
CloudFrontの設定
CloudFrontコンソールを開く。
「Create Distribution」
Webで「Get Started」
Alternate Domain Names(CNAMEs): example.com
と入力して、
「Request or Import a Certificate with ACM」をクリックすると、
AWS Certificate Manager のページが開くので、
「証明書のリクエスト」からドメイン名を追加します。
ドメイン名: example.com
と入力して「次へ」
「DNSの検証」を選択して「確認」を押すと検証のページに遷移します。
ドメインのDNS設定にCNAMEレコードを追加
「Route 53 でのレコードの作成」をクリックするとCNAMEが追加されます。
オリジンの設定 – 独自ドメイン
Origin Settings
Origin Domain Name: example.com
Origin Protocol Policy: HTTPS Only
オリジンの設定 – EC2
Origin Settings
Origin Domain Name: （EC2インスタンスのドメイン）.compute.amazonaws.com
Origin Protocol Policy: HTTP Only
オリジンの設定 – S3
Origin Settings
Origin Domain Name: （バケット名）.s3.amazonaws.com
Behavior – デフォルト
Path Pattern: Default(*)
Origin: （EC2インスタンスのドメイン）.compute.amazonaws.com
Viewer Protocol Policy: Redirect HTTP to HTTPS
Allowed Encryption Methods: GET, HEAD, OPTIONS, PUT, POST, PATCH, DELETE
Cache Based on Selected Request Headers: All
Forward Cookies: All
Query String Forwarding and Caching: Forward all, cache based on all
Behavior – /wp-admin/*
Path Pattern: /wp-admin/*
Origin: （EC2インスタンスのドメイン）.compute.amazonaws.com
Viewer Protocol Policy: Redirect HTTP to HTTPS
Allowed Encryption Methods: GET, HEAD, OPTIONS, PUT, POST, PATCH, DELETE
Cache Based on Selected Request Headers: All
Forward Cookies: All
Query String Forwarding and Caching: Forward all, cache based on all
Behavior – /wp-login.php
Path Pattern: /wp-login.php
Origin: （EC2インスタンスのドメイン）.compute.amazonaws.com
Viewer Protocol Policy: Redirect HTTP to HTTPS
Allowed Encryption Methods: GET, HEAD, OPTIONS, PUT, POST, PATCH, DELETE
Cache Based on Selected Request Headers: All
Forward Cookies: All
Query String Forwarding and Caching: Forward all, cache based on all
Behavior – S3
Path Pattern: /wp-content/uploads/*
Origin: S3バケットを選択
SSL Insecure Content Fixer
コンテンツのURLにHTTPが混在するとブラウザで警告が出て正しく表示されない場合。
WordPressのプラグイン SSL Insecure Content Fixer で対処。
非セキュアコンテンツの修正方法: シンプル
HTTPS の検出方法: HTTP_CLOUDFRONT_FORWARDED_PROTO (Amazon CloudFront HTTPS キャッシュ済みコンテンツ)
Offload S3
WordPressでメディアをS3バケットで公開するためのプラグイン
Copy Files to S3: ON
Rewrite File URLs: ON
CloudFront or Custom Domain: example.com
Path: wp-content/uploads/
Year/Month: ON
Force HTTPS: ON