【Terraform】指定したドメインでCloudFrontにアクセスできない。。。

エラー

 

Route53でCloudFrontとドメインを関連付け、ACMを適用しました。

だけど、そのドメインにアクセスしてもうまく表示されなかったので、解決していきます。

※Terraformを使って構築しています

 

環境

 

  • WSLでUbuntsuを使用
  • Terraform v1.4.2

 

ゴール

 

https://<用意したドメイン(test.hisui-app.com)>/index.html

にアクセスし、下記が表示されるようにしたい

 

現状

 

  • <用意したドメイン(test.hisui-app.com)>/index.htmlAレコードに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エラーが返ってくるみたい

https://repost.aws/ja/knowledge-center/CloudFront-troubleshoot-403-errors

 

対処①:CloudFrontとACMを紐づける

 

CloudFrontとACMを紐づけていきます

こちらを参考に、下記のようにコードを修正してみます

 

これで terraform apply します

 

エラー②:ACMのリージョンがダメ

 

ん、エラーが出ました。。。

DeepLで翻訳してみると

ということらしい。

 

確かにAWS 公式ドキュメントを見ても

CloudFrontに適用する場合にはバージニア北部 (us-east-1) リージョンにないとダメらしい

 

対処②:ACMのリージョンをバージニア北部へ

 

ACMをバージニア北部 (us-east-1) リージョンに作っていきます

ただ、ほかのリソースは基本 東京(ap-northeast-1)リージョンに作成したいので、

エイリアスを使用していきます。

 

下記のようにproviderを指定します。

aliasを指定していないほうはデフォルトで使用されます。

 

そして、ACMのみ virginia というエイリアスを設定した provider を指定します。

 

これで terraform apply します

 

エラー③:aws_acm_certificate_validation修正

 

 

ACMが見つからないって言ってますね。。。

 

対処③:aws_acm_certificate_validation修正

 

aws_acm_certificate_validationのほうもバージニア北部リージョンにする必要がありました

 

 

これで terraform apply します

とりあえず通りました!

 

エラー④:サポートされていないプロトコルが使用

 

test.hisui-app.com/index.html にアクセスしてみると、以下のエラーが。

 

 

サポートされていないプロトコルが使用されています。」???

 

対処④:エイリアスの設定

 

CloudFrontに対して任意のドメインを使用するには代替ドメインを設定する必要があります。

ERROR: The request could not be satisfied

 

これをTerraformに落とし込みます

 

これで terraform apply します

 

動作確認

 

test.hisui-app.com/index.html にアクセスしてみます

 

無事、表示されました!!!(HTTPSでアクセスできてます)

 

参考

 

https://repost.aws/ja/knowledge-center/CloudFront-troubleshoot-403-errors
Terraform Registry

terrafromでaws acm作成 cloudfrontの場合バージニアで作成しないといけないんだけどどうやるの? - Qiita
providerの設定を変更したものを用意して、aliasを使うことで解決provider "aws" {}provider "aws" { alias = "virginia" region …

コメント

タイトルとURLをコピーしました