Route53でCloudFrontとドメインを関連付け、ACMを適用しました。
だけど、そのドメインにアクセスしてもうまく表示されなかったので、解決していきます。
※Terraformを使って構築しています
環境
- WSLでUbuntsuを使用
- Terraform v1.4.2
ゴール
https://<用意したドメイン(test.hisui-app.com)>/index.html
にアクセスし、下記が表示されるようにしたい
現状
- <用意したドメイン(test.hisui-app.com)>/index.html のAレコードにCloudFrontのエイリアスを指定
- ACMにて、test.hisui-app.comのSSL証明書を取得済み。
- test.hisui-app.comにHTTPSでアクセスできない。。。
- CloudFrontのオリジンにはS3を設定
- オリジンのS3にはindex.htmlがアップロードされている
- <CloudFrontのドメイン>/index.htmlにアクセスすると、index.htmlが表示される
- <用意したドメイン(test.hisui-app.com)>/index.html にアクセスすると
下記のように403エラーが表示される
原因調査
- test.hisui-app.comにHTTPSでアクセスできない。。。
- <CloudFrontのドメイン>/index.htmlにアクセスすると、index.htmlが表示される
上記より、CloudFront – S3間はうまくいっており、ACM – CloudFrontがダメかな
と予想しました。
調べてみると、
CloudFrontがHTTPS通信のみを要求していますが、ACMが適用されておらずHTTPでアクセスしていたこと
が原因みたいです。
要は、CloudFrontにACMを適用できていなかったんですねぇ。。。
下記のAWS 公式ドキュメントを見ても、
HTTPでアクセスすると403エラーが返ってくるみたい
対処①：CloudFrontとACMを紐づける
CloudFrontとACMを紐づけていきます
こちらを参考に、下記のようにコードを修正してみます
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
# CloudFrontを定義 resource "aws_CloudFront_distribution" "main" { ... viewer_certificate { acm_certificate_arn = aws_acm_certificate.cert.arn ssl_support_method = "sni-only" minimum_protocol_version = "TLSv1" } } # ACM証明書を定義 resource "aws_acm_certificate" "cert" { domain_name = "test.hisui-app.com" validation_method = "DNS" lifecycle { create_before_destroy = true } } |
これで terraform apply します
エラー②：ACMのリージョンがダメ
ん、エラーが出ました。。。
|
1 2 3 4 5 6 7 8 9 |
╷ │ Error: updating CloudFront Distribution (********): InvalidViewerCertificate: The specified SSL certificate doesn't exist, isn't in us-east-1 region, isn't valid, or doesn't include a valid certificate chain. │ status code: 400, request id: ******** │ │ with aws_CloudFront_distribution.main, │ on CloudFront.tf line 2, in resource "aws_CloudFront_distribution" "main": │ 2: resource "aws_CloudFront_distribution" "main" { │ ╵ |
DeepLで翻訳してみると
|
1 2 3 |
指定されたSSL証明書が存在しない、 us-east-1リージョンにない、有効でない、 または有効な証明書チェーンを含んでいない場合です。 |
ということらしい。
確かにAWS 公式ドキュメントを見ても
CloudFrontに適用する場合にはバージニア北部 (us-east-1) リージョンにないとダメらしい
対処②：ACMのリージョンをバージニア北部へ
ACMをバージニア北部 (us-east-1) リージョンに作っていきます
ただ、ほかのリソースは基本 東京(ap-northeast-1)リージョンに作成したいので、
エイリアスを使用していきます。
下記のようにproviderを指定します。
aliasを指定していないほうはデフォルトで使用されます。
|
1 2 3 4 5 6 7 8 9 10 11 12 |
# デフォルトではこちらの値が使われる provider "aws" { region = "ap-northeast-1" } # こちらを指定するには # provider = aws.virginia # と記述する provider "aws" { alias = "virginia" region = "us-east-1" } |
そして、ACMのみ virginia というエイリアスを設定した provider を指定します。
|
1 2 3 4 5 6 7 8 9 10 11 |
# ACM証明書を定義 resource "aws_acm_certificate" "cert" { domain_name = local.domain_name validation_method = "DNS" # バージニア北部リージョンを指定したproviderを使用 provider = aws.virginia lifecycle { create_before_destroy = true } } |
これで terraform apply します
エラー③：aws_acm_certificate_validation修正
|
1 2 3 4 5 6 7 |
╷ │ Error: reading ACM Certificate (arn:aws:acm:us-east-1*******:certificate/**********): couldn't find resource │ │ with aws_acm_certificate_validation.cert, │ on acm.tf line 13, in resource "aws_acm_certificate_validation" "cert": │ 13: resource "aws_acm_certificate_validation" "cert" { │ |
ACMが見つからないって言ってますね。。。
対処③：aws_acm_certificate_validation修正
|
1 2 3 4 5 |
resource "aws_acm_certificate_validation" "cert" { certificate_arn = aws_acm_certificate.cert.arn validation_record_fqdns = flatten([ values(aws_route53_record.cert)[*].fqdn ]) provider = aws.virginia } |
これで terraform apply します
とりあえず通りました！
エラー④：サポートされていないプロトコルが使用
test.hisui-app.com/index.html にアクセスしてみると、以下のエラーが。
「サポートされていないプロトコルが使用されています。」？？？
対処④：エイリアスの設定
CloudFrontに対して任意のドメインを使用するには代替ドメインを設定する必要があります。
これをTerraformに落とし込みます
|
1 2 3 4 5 6 |
resource "aws_CloudFront_distribution" "main" { aliases = [ "test.hisui-app.com" ] ... } |
これで terraform apply します
動作確認
test.hisui-app.com/index.html にアクセスしてみます
無事、表示されました！！！（HTTPSでアクセスできてます）
参考
コメント