やりたいこと
S3バケットに複数のサブフォルダーを追加して、https://domain_name/folder_nameでそれぞれのフォルダーにアクセスできるようにする
目次
1. 設定
S3バケットにサブフォルダーを追加する
例
BUCKET_NAME/portfolio
BUCKET_NAME/website_1
BUCKET_NAME/website_2
それぞれのサブフォルダーにドキュメントルートとしてindex.htmlを設置
例
BUCKET_NAME/portfolio/index.html
BUCKET_NAME/website_1/index.html
BUCKET_NAME/website_2/index.html
CloudFrontディストリビューションの設定を変更
対象のディストリビューションを選択して、Error pagesタブへ移動
カスタムエラーレスポンスを作成
- エラーコード403を選択
-
response page pathをindex.htmlに設定 - 作成
動作確認
ディストリビューションがデプロイされたら、https://domain_name/folder_nameでアクセスをしてエラーが出なければ完了
2. エラー
上記の設定をしても、403エラーのリダイレクトがされない場合に確認すること
CloudFrontディストリビューションのorigin nameはS3静的ウェブサイトのエンドポイントを設定する
例
⭕️BUCKET_NAME.s3-website-ap-southeast-1.amazonaws.com
origin nameがS3バケットそのもののエンドポイントだとリダイレクトがうまくいかない
❌BUCKET_NAME.s3.ap-southeast-1.amazonaws.com
コメント
ベストプラクティスではないかもしれないけれど、個人や社内のトレーニング用で複数のウェブサイトを一つのバケットで管理したいときに便利だと思った