AWSのみで構築する独自ドメイン/SSL/WordPressサイト

# はじめに

技術系の記事を書くだけならQiitaで良いかと思うんですが、もう少し自由な情報発信もしたいなと考えたときに、他のブログサイトを利用するとか、SNSで情報発信などが気楽に始められてよいのかもしれません。ただ、そこは昔ながらのITエンジニア「自前サーバーを立ててホームページを運営してみよう!」ということにしました。学生時代(20世紀末)にフリーのホームページ提供サービス上にサイトを作って運営していたのを少し思い出します。HTMLをテキストエディタで書いてFTPでアップロードするといった、本当に今考えると嘘みたいな時代です。今どきは月々数百円で立派なサーバーが運用でき、ホームページを作成するにも高機能なCMSを動かしてそこで簡単に豪華なサイトができてしまうのですから進化していますよね。考えようによっては20年たってもやってること変わってないな・・・、という見方もできますが。

では、本題に入ります。今回はAWSのみですべてを実現します。色々組み合わせればもっと低価格で便利なサーバーを運用できるよといった声があるかもしれませんが、ワンストップ実現することにこだわりました。また、すでに先人が同じようなことをやっているので記事も検索すれば色々と出てきます。ただ、以下のすべてが網羅されているサイトが見つからなかったので、各所から情報を集めながら最新情報でまとめ直して環境を構築していきます。

# 構築する環境

1. [Amazon Route 53](https://aws.amazon.com/jp/route53/)で独自ドメイン取得
2. [Amazon Lightsail] (https://aws.amazon.com/jp/lightsail/)でWordPressを構築する
3. [Amazon Certificate Manager](https://aws.amazon.com/jp/certificate-manager/)でSSL証明書を発行・管理
4. [Amazon CloudFront](https://aws.amazon.com/jp/cloudfront/)によるSSL化

# 今回は見送る環境
AWS SESは自由に送信できるようにするには審査が必要で、なんの実績もない新規サイトでこれを通すのは少し厳しいかなという印象です。ということでまずはいったん以下を見送ります。おいおいやっていきたいと思います。
1. [Amazon SES](https://aws.amazon.com/jp/ses/)を使った独自ドメインメールでWordPressのメール送信を設定

# 完成したサイト

本記事の手順で立ち上げたサーバーは以下になります。

[makotomi's Tech Blog](https://www.makotomi.com/)

# Route53で独自ドメイン取得

まず最初に、独自ドメインの取得を行いたいと思います。独自ドメインは自前でサーバーを運用するメリットでもあります。費用はドメインによって様々ですが、AWSで登録する場合、.comや.netなどのドメインであればおおむね年間千数百円程度にしかなりません。

それでは早速、独自ドメインの取得を行います。AWSマネージメントコンソールでRoute53を開き、`ドメインの登録`の`今すぐ始める`を押下します。

![1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/1962d878-7693-a5fe-9302-275d55f460cd.png)

`登録済みドメイン`の`ドメインの登録`を押下します。

![2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/c49d1f40-b482-3914-4dc8-669c40052415.png)

ドメイン名の選択で希望する名称、私の場合**makotomi**を入力し、`.com`で`チェック`を押下します。希望するドメインが空いていれば使用可否に出てきますので、`カートに入れる`を押下し、`続行`で次に進みます。

![3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/03dd28bb-1f8c-56e8-799e-8b979d400488.png)

`2.連絡先の紹介`で必要事項を入力します。`登録者、管理者、および技術的な連絡先はすべて同じです`で**はい**を選び、入力を簡易にします。次に、`連絡先のタイプ`は必ず`**個人**を選択し、`プライバシーの保証`を**有効化**しましょう。これを選択しておかないと、DNSの登録情報に個人情報が掲載されてしまい、whoisで問い合わせると世界中に情報が公開されてしまいます。画像ではぼかしてありますが必須項目に個人情報の入力が必要になります。
![3-1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/f6b7f5b5-9797-b0ff-6601-fb7f96abe432.png)

入力を完了し次に進むと、以下のようなダイアログが表示されます。このタイミングで連絡先に入力した`Eメール`に検証用のメールが送信されています。
![3-2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/c2ac366b-b54f-4f3b-fa28-c86d3b6c614b.png)

メールは以下のような文面で届きますので、URLのリンクをクリックし、メールの検証を完了します。
![4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/f9fe1b51-64a8-84b6-69fd-f5b0f5d954e7.png)

URLのリンクをクリックすると、Eメールの検証成功画面が表示されます。

![5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/01eaa6c2-89a3-9ebb-83e8-1ff999ac52a5.png)

'3.確認と購入'画面では今まで入力した情報、ドメインをどう更新するか否かの選択(今回は有効にしてありますので、1年後に自動的にドメインが更新されるようになるます)、規約への同意確認、先ほど実施したEメールアドレスが検証済みか否かといった情報が出ます。規約に同意し、`注文を完了`を押下することで独自ドメインの購入作業は終了です。
![6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/51c004ec-6839-8692-75ce-eaa35fb181e0.png)

しばらく時間がかる旨のメッセージが表示されます。

![7.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/280acc28-94b0-24c9-fb5f-58daef1e6d6b.png)

ドメイン登録完了のけ画面に表示されます。最大3日かかると画面ででも明日がそこまで時間はかからず、即日で登録は完了しました。`ドメインに移動`を押下し次の画面に進みます。

![8.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/c8de143e-e0ba-420f-18e9-c98b196f605e.png)

今購入したドメインが`保留中のリクエスト`に入り登録作業が進行中であることが表示されます。

![9.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/ed79f18a-0a90-fbff-d05b-66ed9bfe166b.png)

ここで、しばらく待つ(この時は30分未満くらいで登録されましたが、いつもそうなのかは不明です)と`保留中のリクエスト`から`登録済みドメイン`に移動します。

![10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/6a0f53f5-dad2-db47-44af-006971fc3b49.png)

登録済みドメインの設定を開き。今回登録したmakotomi.comの移管のロックを有効化しておきました。AWSから他に名前移管する予定もないので念のためです。

![11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/669919e0-5436-7607-0fdc-c89b2d96f503.png)


## Amazon LightsailによるWordPress構築

Amazon Lightsailは細かい設定なしにサーバーやインフラが適切に設定され、簡単に様々なアプリケーションがのったサーバーを起動できます。さらには、最もリーズナブルなサーバーは3.50 USD/月なので月々400円くらいです。メモリ512MB、1CPU、20GBSSD、1TBのデータ転送がコミコミでこの価格になります。普通に同程度のEC2サーバーを起動すると、t2.nanoのインスタンスで5.472USD/月(0.0076USD/時間 x 24 x 30)、SSD 20GBは2.4USD/月(0.12USD/GB月 x 20) 、ネットワーク転送は1TBで113USD(0.114USD/GBx999GB)となるので、圧倒的に低価格です。
仕事ではCloudformationを使ってEC2ベースでサーバーを細かく構成して運用しているので、LightSailの話を始めて聞いた時にも関心を全く持っていなかったのですが、改めてみるとライトな利用用途だと至れり尽くせりな感じを受けました。

今回はこの最安値のサーバーで、Wordpressを立ち上げてみたいと思います。

まずは、AWSにアカウントを作りましょう。アカウントの作り方は[公式ページ](https://aws.amazon.com/jp/register-flow/)を参考に作成してください。

AWSのコンソールでログインしたらLightsailの画面に入ります。

![1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/e38980b2-4dc4-aed1-ba5b-516ad12cda5b.png)

AWSの画面の中でもかなり特徴的なUIです。明らかに他の機能とターゲットが違うんだろうなというデザインでシンプルなUIになっています。早速__インスタンスの作成__ボタンを押下してサーバーを構築します。

![2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/e70c44ed-4973-7916-eac9-1f819bb5c547.png)

インスタンスのロケーションですが、東京なら、A,C,Dのアベイラビリティゾーン(以下__AZ__)から選択できます。今回は1台のサーバー構成なのでどこを選択しても違いはありません。サーバーを複数台用意して高可用性な構成を作る場合に初めて気にすればよい設定項目です。次にプラットフォームですが、__Linux/Unix__を選択します。次に設計図ですが、目的の__WordPress__を選択します。

![3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/ec9bcade-d28f-29db-7010-9549067476ff.png)

次にインスタンスプランを選択します。先に述べた通り。3.5USDのインスタンスを選択します。ただでさえ低価格なのに最初の1カ月は無料で使用できます。

![4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/4eaeadce-e3f4-2d91-8a64-53f1e0b2521a.png)

最後に任意のリソース名をつけてインスタンスの作成ボタンを押下すれば完了です。これでWordPressサーバーが起動してしまいます。わずか数分作業です。
引き続きインスタンスの設定を続けます。

![4-2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/97e00fda-6465-e9ab-f507-b4057e1d1534.png)

作製したしたインスタンスの管理画面に入り、ネットワーキングの設定ページを開きます。

![5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/e7f03bf9-f1fa-56fd-81e3-37090d6d9ef9.png)

このページのIPアドレスではパブリックIPとプライベートIPの設定値が確認できます。パブリックIPがインターネットからアクセスできるIPアドレス、プライベートIPは内部ネットワークで利用するIPアドレスになります。この段階ではパブリックIPアドレスはインスタンス起動時にランダムで振られるIPアドレスが設定されています。つまり再起動すると毎回変わってしまいます。インターネット上でサイトを公開するためには変わらないIPアドレスを設定する必要があるので、__静的IPの作成__ボタンから設定を行います。

![6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/908c27c5-989d-c1cf-7a8f-434e8f4e76db.png)

静的IPの作成画面では、作成する静的IPをどのインスタンスにアタッチするかを選択します。作成したWordPressサーバのインスタンスを選択し作成を行います。

![7.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/13bd3820-8a33-4a82-5a6b-4fe63da4f6ec.png)

作製が完了すると、IPアドレスが割り当てられます。以降このIPアドレスを使えばサーバーにアクセスできます。早速このIPアドレスをWebブラウザで
開いてみると下記の通り、WordPressのアプリケーションが動いていることが確認できます。

![8.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/044e56f4-fb39-2099-dd4e-616af0458fcb.png)

Webブラウザでのアクセス確認以外は、すべてマウスで選択してボタンを押下しただけです。実に簡単にサーバーが構築できてしまいました。

最後にSSHでつないで二つの作業を実施しておきます。
![9.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/7d1e8be0-7654-c568-f217-4527eac58a96.png)
まず、インスタンスに対してSSHでログインします。

1. 管理者のIDとパスワードの取得

WordPressの管理画面(http://[IPアドレス]/wp-admin/)へのログインをするためのクレデンシャルを取得しておきます。
![10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/02fb3a38-8970-0194-c8aa-d9811ec7d26a.png)
ホームディレクトリの__bitnami_credentials__ファイルにユーザー名とパスワードが書かれています。これを使ってWordPressの管理画面にアクセスすることができます。
2. bitnamiのアイコンを削除
Wordpressの画面の右下に表示されれている以下のアイコンを表示しないように設定変更します。
![11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/5b536b63-1819-b617-8861-6b88144842ba.png)
Shellで以下のコマンドを実行します。

```shell
sudo /opt/bitnami/apps/wordpress/bnconfig --disable_banner 1
sudo /otp/bitnami/ctlscript.sh restart apache
```

![12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/132646fe-e3da-0515-ce86-dc5293bafc76.png)


管理画面にログインできるか、画面からアイコンが消えたかを確認して完了です。

# Amazon Certificate ManagerでSSL証明書を発行・管理

SSL証明書をAmazon Certificate Manager(以下ACM)で発行して管理します。無料でSSL証明書が発行できるうえに、期限が切れしないように自動で更新してAWSのELBやCloudFront、API Gwatewayなどへも自動で設定してくれるのでAWSでサービス運用している個人にとってはベストな選択です。普通のクライアント(PCやスマホなど)であれば、AmazonのRoot CAは検証できるので、DigiCertやGlobalSignなどのメジャーな証明書を何万円も出して買わなくても十分に通用します。ちなみに、本日段階でQiitaや本家AWSの証明書もAWSの証明書だったりするので安心できますよね。それでも心配でもう少し調べてみようといくつか回った時にちょっと面白いなと思ったのは、www.amazon.co.jpの証明書はDigiCert製でした。ECサイトとしては少しのスキが販売機会損失につながるかもしれないからと安心を買っているのかもしれません。

前置き長くなりましたが証明書を発行していきたいと思います。

まず最初に一番重要なことは、今回作成するSSLの証明書はCloudFrontで利用する点です。CloudFrontにACMの証明書を設定する場合には、__バージニア北部(us-easst-1)__で作成する必要があります。
AWSマネージメントコンソールでCertificate Manaerを開き、`バージニア北部`に変更してから、`証明書のプロビジョニング`の`今すぐ始める`を押下します。
![1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/c4d1b83c-5491-a876-4f70-714e8cb992b6.png)

`証明書のリクエスト`で__パブリック証明書のリクエスト__を選択し、`証明書のリクエスト`を押下します。

![2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/fe408f26-93d2-72a7-da33-421cc9e34304.png)

`ドメイン名の追加`で__*.makotomi.com__とし、先ほど取得したドメインのワイルドカード証明書を要求します。ワイルドカード証明書とはサブドメイン部が自由になり、www.makotomi.comのサーバーでもhogehoge.makotomi.comのサーバーでも利用できる証明書になります。もちろんサブドメイン毎に別の証明書を発行するのも問題ありません。無料なのでたくさん証明書を発行しても、それをワイルドカード証明書で集約してもコストメリットがでるわけではありませｎ。
![3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/051ba4ea-345a-e87c-ecf1-745b9bab2351.png)

`検証方法の選択`では__DNSの検証__を選択します。今回はドメインもAWSで購入していますし、Route53で管理されているので、この検証方式が最も簡単になっています。
![4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/058ce3c2-4138-4a28-9b65-44cd00ae2344.png)

`タグを追加`では必要であればタグを追加できますが今回は何もつけないで次に進みます。
![5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/d6d36d00-7cdf-ae78-b022-8a969f711db6.png)

`確認とリクエスト`では、先ほど入力したドメインと検証方法が正しいことを確認し`確認とリクエスト`ボタンを押下します。
![6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/c5f17f26-1792-d2f8-290a-ba5ccfdc3721.png)

`検証`ではドメイン名をクリックし検証作業を行います。
![7.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/eb1137cd-ff1b-70ac-1ecf-a3c950daa8e2.png)

ドメイン部を開くと`Route 53でのレコードの作成`ボタンが出てきます。これもAWSのみで作業しているメリットです。検証用のレコード設定をボタン1個押すだけでDNSに登録できます。
![8.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/7e597e28-5df3-fa47-3ec1-54233d76c505.png)


ボタンを押下したら以下の確認画面が表示されるので`作成ボタン`
を押下します。
![8-2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/80dee501-421c-74d3-13ee-8e81de2c811a.png)

結果画面が表示されます。Certification Managerが今登録されたレコードの名前解決ができるかをチェックすることで証明書が有効になります。これには最大30分かかるということなのでしばらく時間を待つ必要があります。
![9.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/629d1560-2fea-1693-1b81-8bcf22e5fb57.png)

なお、このタイミングでRoute53のドメイン情報を確認すると以下のようにレコードが追加されていることが見て取れます。
![10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/a862031f-bc43-20a2-c94d-021a10b0ffc6.png)

しばらく後、Certification Managerを確認すると以下のように証明書の検証状況が確認できます。`検証状態`が__成功__、'状況'が__発行済み__になっていれば完了です。

![11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/d37e7d13-40ae-ba5a-a841-50ff1cbb12cc.png)

#Amazon CloudFrontによるSSL化
いよいよWordPressをSSL化します。

まず、Route53にドCloudFrontからLightsail上のWordPressにアクセスするために、WordPressのドメイン名を設定します。
AWSマネージメントコンソールでRoute53を開き、`ホストゾーン`の`対象となるドメイン`を選択します。
![1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/18845958-db50-fe31-6236-0ca9cd09c0fe.png)

対象のドメインで、`レコードセットの作成`ボタンを押下し、名前に__blog__、タイプを__Aレコード__、値にWordpressのサーバーに割り当てた__静的IP__を入力し`作成`ボタンを押下します。これで、ドメイン名の登録が完了したのでhttp://blog.makotomi.com/ でアクセスしサーバーが開けるか確認してみてください。登録してからアクセスできるようになるまで少し時間差がある場合がありますので、すぐに開かなくても慌てず少し待ってからアクセスしてみましょう。
![2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/f40df8cb-e465-8d25-d45e-de3f27644730.png)

次にCloudFrontでDistributionの作成を行います。AWSマネージメントコンソールで`CloudFront`を開き、`Create Distribution`ボタンを押下します。
![3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/d6346506-4d8b-5c5f-08ff-14e260bdfe89.png)

`Select delivery method`で__Web__の`Get Started`ボタンを押下します。
![4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/b64ed9f9-e762-4641-47a2-9544375c4871.png)

`Create distribution`の`Origin Settings`を入力していきます。`Origin Domain Name`にWordpressのドメイン名__blog.makotomi.com__を入力します。残りはデフォルトトの値のままとしています。
![5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/0c2ea9ce-250f-9d6a-67f7-4c116e13f327.png)

次に、'Default Cache Behavior Settings'を入力していきます。`Viwer Protocol Pollicy`で__Redirect Http to Https`を、`Allowed HTTP Method`で＿＿GET,HEAD,OPTIONS,PUT,POST,PATCH,DELETE__を、`Cace Based on Selected Request Headers`で__All__を、`Forward Cookies`で__All__を、`Query String Forwarding and Caching`で__Forward all, cache based on all__をそれぞれ設定し、残りはデフォルトの値のままとしています。
![6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/b26f8713-5119-6491-dbc6-a0201bebf033.png)

最後に、'Distribution Settins`を入力していきます。'Alternate Domain Names(CNAMEs)`に今回のWordPressを公開したいドメイン名として__www.makotomi.com__を入力します。`SSL Cerfiticate`に__Custom SSL Certificate(example.com)__を選択し、ドロップダウンから前段で登録した、__*.makotomi.com__のワイルドカード証明書を選択します。ここで、__Custom SSL Certificate(example.com)__が選択できない場合は、バージニア北部に証明書ちゃんと登録されているか今一度確認してみてください。残りはデフォルトトの値のままとして、`Create Distribution`ボタンを押下します。
![7.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/7cee860f-0f08-9b05-afff-d5b618496cac.png)

登録が完了すると一覧に表示されます。`State`が`Enabled`に変わるまで少しかかりますので待ちましょう。ここでRoute53へ登録を行うために、`Domain Name`を記録してください。
![8.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/a8e9b750-18ef-501b-f43a-7715e587f66b.png)

AWSマネージメントコンソールでRoute53を開き、`ホストゾーン`の`対象となるドメイン`を選択します。対象のドメインで、`レコードセットの作成`ボタンを押下し、名前に__www__、タイプを__CNAME__、値にCloudFrontのDistributionの__ドメイン名__を入力し`作成`ボタンを押下します。これで、ドメイン名の登録が完了したのでhttps://www.makotomi.com/ でアクセスしサーバーが開けるか確認してみてください。ここでも登録してからアクセスできるようになるまで少し時間差がある場合がありますので、すぐに開かなくても慌てず少し待ってからアクセスしてみましょう。また、http://www.makotomi.com/ でアクセスしてもhttps://www.makotomi.com/ にリダイレクトされることも確認しましょう。

なお、この段階では画面のスタイルが崩れて適切な表示にならないと思います。それを修正するためにWordPressの設定を変更します。`SSL Insecure Content Fixer`プラグインを使う方法が一番簡単そうでしたのでそれで進めます。

WordPressの管理画面に入り、プラグインより‘SSL Insecure Content Fixer`を`今すぐインストール`し、'有効化'します。![10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/40498f38-1fd8-9c0b-2299-550796bacbb3.png)

設定画面に入り、HTTPSの検出方法で__HTTP_CLOUDFRONT_FORWARDED_PROTO (Amazon CloudFront HTTPS キャッシュ済みコンテンツ)__を選択します。
![11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/273926/105996d0-5635-a198-8954-70f5d1af0fb8.png)

以上で、httpsでアクセスした際も正常動作するようになります。

# まとめ
以上で独自ドメインのWordPresサイトの構築が完了しました。CloudFrontを通さずHTTPでも直接アクセスすることができてしまうんですが、そのルートを閉じて厳密にSSLのみで運用しなくても良いかなと考えています。
この後のWordPressの設定に関しては、Qiitaの記事っぽくないかなと考えていますし、せっかく立ち上げたので[makotomi's Tech Blog](https://www.makotomi.com/)の[ここ](https://www.makotomi.com/category/site-construction/)に記事として書いていこうと思います。