名言アプリ作成「SSL化」

## はじめに
開発したWebアプリをHTTPSに対応させるにあたって、当初難しく考えていたのがとっても簡単に（SSL化自体は1,2分程度で）できて感動したのでまとめて記事にしました。

## 実行環境
|  | 実行環境 |
|:-:|:-:|
|  サーバー | AWS EC2インスタンス  |
| OS  | Ubuntu  |
| Webサーバーソフトウェア | Apache |
| DNS | お名前.com<br>（ドメイン取得も） |

## SSL化の手順
今回SSL証明書は[Let's Encrypt](https://letsencrypt.org/ja)でとりました。（後述）
### 1. Certbot のインストール
```
sudo apt update
sudo apt install -y certbot python3-certbot-apache
```
### 2. SSL証明書を取得
```
sudo certbot --apache -d yourdomain.com
```
これでSSL化完了！（certbot便利すぎる😢）


:::note info
取得したSSL証明書ファイル群は /etc/letsencrypt/live/yourdomain.com/　に保存される。
:::

## Let's Encryptを使う理由
まず証明書取得にかかる費用が無料です。一般的にはこれに数千円～数十万円かかるそうです。（実際お名前.comで取得しようと思うと新規発行28,600円、サービス維持調整費に7,293円かかるとでました。）

無料なのは、「世界中のWebサイトのSSL化をもっと広める」というミッションのもと、名だたる企業などがスポンサーになっていて、かつLet's Encruptの運営法人ISRGが公益法人であるからだそうです。

ただ有効期限の短さ・信頼性・保証・企業要件などを考慮すると、商用のSSL証明書を選ぶメリットもあります。特に、ECサイト・金融機関・企業サイトなどでは、保証や信頼性の高いSSL証明書を使う方が適していることが多いです。

## cerbotについて
cerbotは
- **SSL証明書を取得して設置**（/etc/letsencrypt/live/yourdomain.com/ に保存）
- **ApacheのSSL設定を自動変更**（yourdomain-le-ssl.conf を作成）
- **Apache を再起動し、HTTP ⇒ HTTPS のリダイレクト設定**
を自動で処理してくれているので、特にカスタム設定を追加しない場合は、このコマンド1つで HTTPS が有効になります。

しかし、Let's Encryptは有効期限が短いので、証明書を自動で更新する設定を別途していきます。
```
sudo certbot renew --dry-run
```
Cronに追加していきます。（Cronは起動している限り定期的にプログラムを実行してくれるアプリケーションです）
```
sudo crontab -e
```
ファイルを作成して、次の行を追加
```
0 3 * * * certbot renew --quiet && systemctl reload apache2
```

## 事前準備（個人的な）
最後に今回わたしが名言アプリにおいてHTTPとしてデプロイするまでの開発過程も書くので参考になれば幸いです。
### 1. お名前.comでのドメイン取得と基本設定  

#### 1.1 お名前.comでドメインを取得  
1. [お名前.com](https://www.onamae.com/)にアクセスし、アカウントにログインする。  
2. 「ドメイン検索」で希望のドメインを取得する。  
3. 購入手続きを完了し、管理画面にアクセスする。  

#### 1.2 お名前.comのDNS設定（Elastic IPとの関連付け）  
1. お名前.comの「ドメイン管理」ページへ移動する。  
2. 「ネームサーバー設定」を開き、「DNSレコード設定」を選択する。  
3. 追加するレコードを以下のように設定する。  
   - **ホスト名**: `@`（または `www`）  
   - **TYPE**: `A`  
   - **VALUE**: 取得したElastic IPアドレス  
   - **TTL**: デフォルトのままでOK  
4. 設定を保存し、反映されるまで待つ（最大24時間程度）。  

### 2. AWSでElastic IPを取得とEC2インスタンスの準備  

#### 2.1 Elastic IPの取得  
1. [AWSマネジメントコンソール](https://aws.amazon.com/jp/console/)にログインする。  
2. 「EC2」サービスを開く。  
3. 左メニューから「Elastic IP」を選択する。  
4. 「Elastic IPアドレスの割り当て」をクリックし、IPを取得する。  
5. 割り当てたElastic IPを対象のEC2インスタンスに関連付ける。  

#### 2.2 EC2インスタンスの作成（Ubuntu）  
1. EC2ダッシュボードで「インスタンスを起動」する。  
2. Amazon Machine Image（AMI）で **Ubuntu 20.04 LTS** または **Ubuntu 22.04 LTS** を選択する。  
3. インスタンスタイプを選択する（`t2.micro`が無料で推奨されるが自分は`t2.small`で作った）。  
4. キーペアを作成または既存のものを選択する。  
5. ストレージ設定を適用する。  
6. セキュリティグループを設定する（後述）。  
7. インスタンスを起動し、Elastic IPを割り当てる。  

### 3. Apacheのセットアップ（EC2側）  

#### 3.1 SSHでEC2に接続  
Elastic IPが `203.0.113.0` の場合、以下のコマンドで接続する。  
```sh
ssh -i /path/to/key.pem ubuntu@203.0.113.0
```

https://www.youtube.com/watch?v=AGmkG0wJ8LA&list=LL&index=30&t=904s

上の動画がを参考になりました。

#### 3.2 Apacheのインストール  
EC2インスタンスにログインしたら、まずパッケージリストを更新する。その後、Apacheをインストールする。
```
sudo apt update  
sudo apt install -y apache2  
```

#### 3.3 Apacheの起動と自動起動設定  
インストールが完了したら、Apacheを起動し、自動起動設定を有効にする。
```
sudo systemctl start apache2  
sudo systemctl enable apache2  
```

#### 3.4 VirtualHostの設定  
Apacheの設定ディレクトリ内に新しい設定ファイルを作成し、適切な設定を記述する。設定内容には、サーバー名として取得したドメインを指定し、ドキュメントルートを「/var/www/html」に設定する。さらに、エラーログとアクセスログのパスを指定する。設定を保存した後、Apacheのサイト設定を有効にし、設定を適用するためにApacheを再起動する。

- 設定ファイルを作成する。
```
sudo nano /etc/apache2/sites-available/example.com.conf  
```
- 以下の設定を追加する。（これは80番ポートなのでHTTPの設定になる）
```
<VirtualHost *:80>  
    ServerName example.com  
    ServerAlias www.example.com  
    DocumentRoot /var/www/html  
    <Directory "/var/www/html">  
        AllowOverride All  
        Require all granted  
    </Directory>  
    ErrorLog ${APACHE_LOG_DIR}/example.com-error.log  
    CustomLog ${APACHE_LOG_DIR}/example.com-access.log combined  
</VirtualHost>  
```
- 設定を適用する。
```
sudo a2ensite example.com  
sudo systemctl reload apache2  
```

### 4. セキュリティグループの設定（AWS側） ）  

AWSのEC2インスタンスのセキュリティグループに以下のルールを追加する。

*   **HTTP(80)** : `0.0.0.0/0`（または必要に応じたIP範囲）
*   **HTTPS(443)** : `0.0.0.0/0`（SSL設定時に必要）
*   **SSH(22)** : **管理者のIPのみ許可**

:::note info
今回はすべてのデバイスからのアクセスを許可したいのでHTTPとHTTPSは`0.0.0.0/0`に設定した。これをマイIPに設定してしてしまっていたため、私はスマホからの閲覧において、Wifi接続時はアクセスできるがこれを切ると見れなくなるという失敗をしました😢トラフィックの制御は今後WAFの導入などで行いたいと考えています。
:::


### 5. 動作確認  

ブラウザを開き、取得したドメインにアクセスすることでApacheのデフォルトページが表示されることを確認する。また、Apacheのステータスを確認することで、サーバーが正常に稼働しているかをチェックする。