CloutFrontでwebとS3両方キャッシュさせる時の3つの注意点

CloutFrontでwebとS3両方キャッシュさせる時の3つの注意点

こんにちは。キャレット合同会社の椎原です。今回も構築時にハマってしまった件を解決したので、備忘録として残しておきたいと思います。

CloutFront、キャッシュですが、EC2→ALBからのweb表示とS3を一つのCloutFrontでさせたい。Route53で、URLで表示させるときに両方表示させたい場合。

%E9%9B%91%E8%A8%98%E5%B8%B3%209fa2bb4857744db18a1699317e96ec6a/_2021-05-10_110935.png

BehaviorsのPath Patternの指定

これ、頭にバックスラッシュを入れるかどうか悩みましたが、公式だとどっちでもいいとのことです。例えば、/archive/* とarchive/*はどっちでもいいです。

セキュリティグループはポート開放

CloutFrontのセキュリティグループで、webはHTTPとHTTPS解放したのですが、S3は? 使っているポートはHTTPとHTTPSなので開けてください。

Behaviorsの順番が重要

ビヘイビアの実行優先順位というのがありまして、プログラマの方ならよく知っているif文がネストしているような感覚で、マッチングが判定されます。

%E9%9B%91%E8%A8%98%E5%B8%B3%209fa2bb4857744db18a1699317e96ec6a/_2021-05-06_163836_LI.jpg

  1. 上記の例だと、まず、https://xxxxxxxxxxxx.cloudfront.net/archive/testImage.jpgがPrecedence0なので、archive/*のパスパターンと一致し、S3から取り出されます。
  2. 次に、https://xxxxxxxxxxxx.cloudfront.net/test.htmlがPrecedence1なので、*に一致しalbのオリジンを見に行ってELB内のtest.htmlを取り出します。
  3. さて、https://xxxxxxxxxxxx.cloudfront.net/testImage2.jpgとした場合どうでしょうか? 一見、Precedence2の*に一致しS3のバケット直下を見に行くように思えます。しかし、実際は、Precedence1のパスパターンの*に引っかかり、そんなファイルはないよと、404で返されます。

Precedence1のパスパターンが*.htmlとしているのなら、Precedence2を見に行くようになるらしいのですが、上記の例だと、Precedence2は無意味な指定となっています。Precedence2に探しにいくことはあり得ません。

おわかりになられましたでしょうか?

なお、一回設定を間違えてしまうとキャッシュされてしまい、同じ表示が出てきます。オリジンのTTL設定、Invalidations、ブラウザのキャッシュの設定を変えて再表示させてください。

念のために書いておきますが Route53のAレコードにCloutFrontを設定するとき、証明書はバージニア北部で取っておかないと、選択欄がグレーアウトして出てきません。

お問い合わせ

記事の内容についてもっと詳しく知りたい方や キャレットへのお問い合わせ・資料請求はこちらからお気軽にご連絡ください。

Uncategorizedカテゴリの最新記事