はじめまして、TRYT開発課エンジニアの安原です。
少し前にWEBページのホスティングの設定をするにあたって、少し躓いた点と気づきがありましたので、記事に残しておこうかなと思います。
やりたかったこと
- 静的なWEBページのホスティング
ホスティングの方法として、今回はCloudFrontを経由してS3にアップロードしてある静的ページ(HTML、CSS)にアクセスできるようAWS上で設定を行いました。
CloudFront側の設定では特定のURLパスにアクセスしてきた場合に、S3の資材を参照するようにしたかったため、大凡の設定は以下となります。
設定後、試しにhttps://{ドメイン}/lp/drのURLアクセスしてみると空のファイルがダウンロードされてしまい、何故このような現象が起きるのか原因がわかりませんでした。
原因
調べてみると、コンソール上でS3にフォルダ(構造:lp/dr/)を作成し、その中に静的WEBページの資材をアップロードしたことが起因して発生した事象であることわかりました。
S3のマネジメントコンソール上の「フォルダの作成」から新規フォルダを作成するとS3内部では「新規フォルダ名/ 」というkeyの(空の)オブジェクトが1つ作られ、そのファイルをダウンロードしていたようです。
キー(フルパス名) | バリュー(ファイルの内容) |
---|---|
lp/dr/ | (空) |
lp/dr/index.html | index.htmlファイルの中身 |
解決策としてはディレクトリ構成を維持した状態でファイルをS3にアップロードすることで、空のオブジェクトは作られず、lp/dr/index.htmlファイルを無事に読み取ることができました。
気づき
原因の調査をしていく中で、S3の中身はKey-Value ストア型で「ディレクトリ」という概念自体が存在しない事について知りました。 S3の管理コンソール上でフォルダのように振る舞って見えるのは、list-objectなどの特定のアクションなどによってフォルダ内の直下要素をリストアップすることができ、 これらの仕組みを利用して、概念が存在しない「フォルダ」のような振る舞いをしているとのことでした。