2011-07-14 17 views
26

サイトの現在の計画は、Amazon Cloudfrontサービスを、CSS、JavaScript、およびImagesなどのアセットファイルやその他の静的ファイルのCDNとして使用することです。Amazon S3クラウドフロント展開のベストプラクティス

現在、これらのすべての静的ファイルを含むS3に1つのバケットがあります。ファイルは、それらが何であるかによって異なるフォルダに分かれています。 "スクリプト"はJSファイル、 "画像"は画像、その他です。yadda yadda yadda。

私が最初から気づいていなかったことは、S3からCloudfront Distributionにバケットをデプロイすると、その後のバケットへのすべてのアップデートが同じDistributionに再びデプロイされなくなるということでした。したがって、静的なファイル更新があるたびに別のCloudfrontインスタンスにバケットを再デプロイする必要があるように見えます。

画像に変更があった場合は、新しい画像を作成するだけで簡単に確認できるので、画像には問題ありません。しかし、それはCSSとJSにとっては難しいことです。ベストプラクティスの質問に私を取得しますので、

、:

  1. が、すべての生産展開のための別のCloudFrontのディストリビューションを作成することがベストプラクティスですか?ここでの問題は、CNAMEレコードに問題が発生することです。
  2. これらのファイルの性質上、CSSとJSをCloudfrontに格納しないようにするのがベストプラクティスですか、簡単に変更する必要がありますか?それがCDNの目的であるため、これに対する答えがNOのように見えます。
  3. クラウドフロントの他の方法はありますか?
+0

こんにちは、あなたのcssをCDNにどのように導入しましたか教えてください。 css、jsファイルをCDNにどのように送ったのですか?カピストラーノを使っていますか? – tcgumus

+0

use cloudflare、それは無料です:D – rocketspacer

答えて

17

CloudFrontに対して無効化リクエストを発行できます。代わりに、S3バケットの

http://docs.amazonwebservices.com/AmazonCloudFront/latest/DeveloperGuide/Invalidation.html

、しかし、我々は、カスタムの原点として、私たち自身のサーバーを使用しています。 .htaccessエイリアスstyle_*.cssstyle.cssがあり、style.cssのファイル変更時刻をHTMLに挿入します。 CloudFrontはまったく異なるURLを見るので、新しいバージョンを取得します。

(注:一部のCDNを使用すると、クエリ文字列を経由して、しかし、CloudFrontのキャッシングのためのすべてのクエリ文字列データ、したがって.htaccessソリューションを無視することにしましょう。)

編集:は、CloudFrontのは、(任意で)使用するように設定することができ今すぐクエリ文字列。

+4

どちらも良い解決策ですが、私はあなたの秒が完璧だと思います。 CDNの前に、(バージョン番号が何であれ) "?v = 2.0.x"をキャッシュ破棄のすべてのアセットURLに追加しましたが、CloudFrontで "stylesheet-v2.0.x.css"に変更した場合は、サーバーを原点とすると、うまくいくと思います。ありがとう! –

+0

うれしい私は助けることができました!私たちが賢明になる前に、CFがクエリ文字列を数回ドロップすることで噛まれました。 :-) – ceejayoz

+3

無効化には、一度に処理できるファイルの数に制限があり、遅くなる可能性があるので、2番目の解決策は間違いありません。 –

8

CloudFrontは、キャッシュを無効にするために使用できるクエリ文字列のサポートを開始しました。 http://aws.typepad.com/aws/2012/05/amazon-cloudfront-support-for-dynamic-content.html

+0

どうして、これを使って特定のファイルのキャッシュを無効にするのですか?おそらくそれはどこかのリンクにありますが、それはあまり明確ではありません。 – gMale

+0

クエリ文字列をアクティブにすると、各パラメータの組み合わせに対してressourceがキャッシュされます。あなたはバージョンを追加することができます。詳細については、img.jpg?version = 1および?version = 2を参照してください。http://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/QueryStringParameters.html – Dukeatcoding