AWS S3, CloudFront, Certificate Manager 架設靜態網站

4 min readJan 26, 2022

--

使用 AWS 上的 S3, CloudFront 架設網站, 並藉由 AWS Certificate Manager 申請 SSL. 這樣的會就可以不用開啟S3的Static website hosting .藉由 CloudFront 還可以讓 bucket 不必公開, 限制 bucket 只能由 CloudFront 讀取~

## 流程

S3 建立 Bucket, public 權限打開, 放入你的靜態網頁(index.html)

2. AWS Certificate Manager 申請 SSL (一定要在 virginia us-east-1 !!)

3. CloudFront 建立 Distribution, 並指向S3 Bucket.

4. S3 public 權限要關掉(如果沒用OAI的話)

## 1. S3 建立 Bucket

Everyone Read 權限打開不然沒人連的到網站
指定CloudFront cache 時間 https://docs.aws.amazon.com/zh_tw/AmazonCloudFront/latest/DeveloperGuide/Expiration.html
因為透過 Cloudfront 所以 Static website hosting 並不需要開啟

## 2. AWS Certificate Manager 申請 SSL

#### 使用DNS驗證

使用DNS驗證的話, AWS會自動幫你 renew憑證, 如果使用email的話這樣每年都要自己手動renew

有以下2種方式做認證, 看是要用AWS 的 Route 53 , 或是第三方的DNS供應商

1. 不是使用 Route 53 做為 DNS 供應商，

您必須擷取 CNAME 資訊並新增至 DNS 資料庫。您可以使用兩種方式的任一種執行此動作：

1. 複製顯示在 Domains（網域）部分的 CNAME 元件。這些資訊需手動新增至 DNS 資料庫。
2. 選擇 Export to CSV（匯出至 CSV）。結果檔案中的資訊需手動新增至 DNS 資料庫。

2. (選用) 使用 Route 53 進行驗證。

Create records in Route 53（在 Route 53 中建立記錄）按鈕會在符合以下情況時顯示：
您使用 Route 53 做為 DNS 供應商。
您擁有寫入 Route 53 託管區域的許可。
您的 FQDN 未經驗證。

注意

如果 Create record in Route 53 (在 Route 53 中建立記錄) 按鈕遺失或停用，請參閱「ACM 主控台不會顯示「Create record in Route 53」(在 Route 53 中建立記錄) 按鈕」。

選擇 Create records in Route 53（在 Route 53 中建立記錄）按鈕，然後選擇 Create records（建立記錄）。所以此 Certificate status（憑證狀態）頁面應該開啟並顯示狀態橫幅報告 Successfully created DNS records（成功建立 DNS 記錄）。您的新憑證可能會繼續顯示 Pending validation（待定驗證）狀態最多 30 分鐘。

提示

您無法透過編寫程式的方式請求 ACM 自動在 Route 53 中建立記錄。但是您可以對 Route 53 發出 AWS CLI 或 API 呼叫，以在 Route 53 DNS 資料庫中建立記錄。如需有關 Route 53 記錄集的詳細資訊，請參閱使用 Route 53使用資源記錄集。

更詳細的話可以看官網的介紹 https://docs.aws.amazon.com/zh_tw/acm/latest/userguide/dns-validation.html

## 3. Cloudfront 建立 Distribution

這邊就要建立一個CDN, 然後對應到剛剛建立好的 S3 Bucket

1. `Origin Domain Name` 選擇剛剛建立的S3 Bucket

OAI

如果沒有 Origin Access Identity (OAI) 的話，Cloudfront 會透過這個 identity 來存取 S3, 所以在S3的 `Grant Read Permissions on Bucket` 這邊必須選擇 `Yes`, 這會自動 update S3 bucket policy, 這樣就允許 Cloudfront 讀取 origin bucket.
如果選擇OAI. bucket can restrict access to only CloudFron, 用在限制 user 只能透過 Cloudfront 讀取靜態網頁, 而不能直接 access S3 bucket.

If you don’t use an OAI, your S3 bucket must allow public access.
If you don’t want your S3 bucket to allow public access,
you can use an OAI. With an OAI, CloudFront sends authenticated requests to your S3 bucket.
This means you can block public access to your S3 bucket while still allowing CloudFront to get objects from the bucket.
To use an OAI, you must update your S3 bucket policy to allow access to the OAI.
When you choose Yes use OAI you can also choose Yes,
update the bucket policy so that CloudFront updates the bucket policy for you.
Otherwise, you must update it yourself.

2. `Viewer protocol policy` 勾 `Redirect HTTP to HTTPS`, 因為都用HTTPS了