5
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【EC2 + Nginx】第2回 サブドメイン登録&SSL化設定

Last updated at Posted at 2023-12-30

はじめに

本記事ではWebサイトやアプリケーションの開発段階でよく設定するサブドメイン登録とSSL化についてまとめます。
少しでも皆さんの参考になれば幸いです。

前回、EC2+NginxでのWebホスティング手順についてまとめました。
続きの内容となりますので、まずは【EC2 + Nginx】 第1回 Webホスティングをご覧ください。

こんな人に読んで欲しい

  • Webサイトやアプリケーションを閲覧する環境を作りたい
  • EC2 + Nginxを使った環境を作りたい
  • (Let's encryptで)SSL化したい
  • Route53にサブドメインを登録したい
  • Nginxについて理解を深めたい

前提条件

  • EC2インスタンス作成済みであること
  • Nginxインストール済みであること
  • Route53に有効なドメインが登録済みであること
    • ドメインが用意された状態で手順を進めていきます

解説内容

実施手順

  • index.htmlの配置
  • サブドメイン登録
  • SSL化
    • SSLサーバ証明書取得
    • 証明書自動更新設定

index.htmlの配置

まずは現状確認のためWebサイトを確認しましょう。
EC2インスタンスの概要画面より「パブリック IPv4 アドレス」をコピーし、以下URLでページを開きましょう。

http://<パブリック IPv4 アドレス>

すると以下画面が表示されます。
default.png
前回、これはNginx内にデフォルトで配置されているHTMLが表示されていると説明しました。
ではNginxの設定ファイルを確認しましょう。

コンソールを開いてEC2へSSH接続します。

ssh -i <キーペア名>.pem ec2-user@<パブリックIP>

次のコマンドでファイルの中身を確認してください。

cat /etc/nginx/nginx.conf

次の記述(一部省略)箇所によりindex.htmlが参照されていることがわかります。

http {
    ~~~省略~~~
    server {
        ~~~省略~~~
        root         /usr/share/nginx/html;
    }
}

では記載されたパスにあるindex.htmlの中身も見てみましょう。
ページに表示される内容と同じであることがわかります。

cat /usr/share/nginx/html/index.html

つまり、この「root」の向き先や「index.html」の中身を書き換えることで表示を切り替えることができるわけです。

では向き先とindex.htmlの中身を書き換えてみましょう。
(今回viコマンド使っていますが、お好きなコマンドを使用してください。)

sudo vi /etc/nginx/nginx.conf

「nginx.conf」の中を以下のように書き換えます。

#root         /usr/share/nginx/html;
root         /usr/share/nginx/test;

次にindex.htmlの格納場所として「test」フォルダを作ります。

sudo mkdir /usr/share/nginx/test

さらに「index.html」を作成します。

sudo vi /usr/share/nginx/test/index.html

サンプルとして以下の中身を貼り付けて作成しましょう。

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>サンプルHTML</title>
</head>
<body>
  <h1>【EC2 + Nginx】SSL化&Basic認証設定</h1>
  <p>正しく表示されました!</p>
</body>
</html>

最後にNginxを再起動しましょう。
何かNginxに対して変更加えた場合は必ず再起動しましょう。

sudo systemctl restart nginx

ページにアクセスしてみてください。先ほど作成したindex.htmlが表示されます。
sample.png
これでindex.htmlの配置が完了しました。

サブドメイン登録

Route53へドメインが登録済みであることを前提条件とします。
初めてドメインを取得する方はお名前.com, ムームードメインなどのサービスを用いてドメインを取得し、Route53にドメインを登録するを実行してください。
既にSSL化したいドメインを取得済みの方は、本セクションを読み飛ばしてください。

今回は登録済みドメインをもとにサブドメインを登録し、そちらをSSL化する手順を説明します。
それでは設定をしていきます。

AWSコンソールより「Route53」ダッシュボードを表示します。
「ホストゾーン」をクリックし、登録済みのドメインを選択します。
次に「レコードを作成」をクリックしましょう。
hostzone.png

「レコード名」に登録したいドメイン名を入力します。

「レコードタイプ」は「A」を選択します。
(Aレコードとは、ドメイン名またはホスト名が参照するIPアドレスの指定に使用するレコードです。)

「値」にはドメインに紐づけるIPアドレスを入力します。
対象のEC2インスタンスの概要ページに記載の「パブリックIPv4アドレス」をコピペしましょう。

右下の「レコードを作成」をクリックします。
a-record.png
これでサブドメイン登録が完了しました。

SSL化

次にHTTPSアクセスするための設定をしていきます。
ACM(AWS Certificate Manager)を使用して証明書発行することもできますが、以下2つのメリットから、今回はLet's Encryptを使用します。

  • コマンド操作で簡単に発行可能
  • ACMはリソースのリージョンを意識する必要がある(今回説明は省きます)

SSLサーバ証明書取得

SSL化するためにはサーバ証明書を取得する必要があります。
まずは必要なパッケージをインストールします。
EC2にSSH接続した状態で次のコマンドを実行してください。

sudo dnf install -y python3 augeas-libs pip

「Complete!」が表示されたらインストール成功です。

次にPythonの仮想環境を/optにセットアップし、「pip」の最新と「certbot」をインストールします。
「certbot」は無料かつ自動でSSLサーバ証明書を発行できるツールです。

sudo python3 -m venv /opt/certbot/
sudo /opt/certbot/bin/pip install --upgrade pip
sudo /opt/certbot/bin/pip install certbot certbot-nginx

/usr/binにシンボリック・リンクを作成します。

sudo ln -s /opt/certbot/bin/certbot /usr/bin/certbot

Nginxを一度停止させます。

sudo systemctl stop nginx

それではSSL証明書を発行します。
まず、この後入力するコマンド実行にてcertbotがサーバー名の一致確認を行うため、nginx.confへサーバー名を登録します。
以下コマンドでnginx.confを編集します。

sudo vi /etc/nginx/nginx.conf

server_nameへドメイン名を記載し上書きします。

server_name.png

次に証明書を取得します。
--nginxオプションはnginx.confを自動編集してくれるもので、-dオプションはcertbot実行時に登録するドメインを指定しています。
その他のcertbotオプションについてはLet's Encrypt総合ポータル コマンド解説をご覧ください。

次のコマンドを実行すると、Certbotから以下の内容を聞かれるのでそれに答えます。

sudo certbot --nginx -d {ドメイン名}

以下はその内容と回答例です。

① メールアドレスを入力してください(緊急の更新およびセキュリティ通知に使用されます)
 → メールアドレス

② ACMEサーバーに登録します。同意しますか?(ACMEは証明書の管理を自動化するためのプロトコルです)
 → Y(同意します)

③ メールアドレス情報を共有しますか?
 → N(共有しません)

「Congratulations!」と表示されれば成功です。

/etc/letsencrypt/live/{ドメイン名}配下に証明書が作成されており、これが参照されるようnginx.confが更新されています。

nginx-update.png

最後にNginxを再起動します。

sudo systemctl restart nginx

次のコマンドでNginxのステータスを確認し、「Active: active (running)」が表示されていれば再起動成功です。

sudo systemctl status nginx

ではHTTPSアクセス可能か確認してみましょう。
以下URLでページアクセスします。

https://<ドメイン>

ページが表示されれば成功です。
これでSSL化が完了しました。

証明書自動更新設定

Let's Encryptで取得した証明書の有効期限は3ヶ月です。
有効期限が近づくとメールが届きますが、都度更新するのは大変なので自動化しましょう。

Amazon Linux 2023にはcronが入っていないのでインストール&起動します。

sudo dnf install cronie-noanacron
sudo systemctl enable crond
sudo systemctl start crond

次に実際には証明書の更新を行わず、検証ができるシミュレーションコマンドがあるので実行してみましょう。

sudo certbot renew --dry-run

以下のようなメッセージが出力されれば成功です!

スクリーンショット 2023-11-05 12.10.57.png

ではcron設定をしていきます。
以下コマンドで編集画面を開きます。

crontab -e

そして以下の内容をコピペして保存しましょう。

# 毎日1:30に更新
30  1  *  *  *  root    sudo certbot renew --post-hook "systemctl reload nginx" --no-self-upgrade # Nginx

最後にcronが設定されていることを確認します。

crontab -l

これで自動更新設定は完了です!

まとめ

今回はindex.htmlとSSL化を設定しました。
特にNginxの設定について、少しでもみなさんの理解につながれば幸いです。

次回は「Basic認証設定」について解説します。

ここまで読んでくださりありがとうございました!

全体構成

ぜひこちらも併せてお読みください。

5
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?