S3であるフォルダ以下のすべてのオブジェクトはGUIでは操作できなかった気がしますが、GUIでも操作できるようになったようです。
今回はあるフォルダ以下のオブジェクトにCache-Controlをつけてみた手順をまとめました。
この記事は個人ブログにも掲載しています。
http://tackeyy.com/blog/posts/how-to-change-all-of-objects-metadata-under-the-folder-with-s3-gui
0. Cache-Control が設定されていないことを確認する
レスポンスに Cache-Control
がないことをcurlで確認します。
$ curl -I https://hoge.cloudfront.net/path/file_name.jpg
HTTP/1.1 200 OK
Content-Type: image/png
Content-Length: 4029
Connection: keep-alive
Date: Wed, 23 Aug 2017 14:04:16 GMT
Last-Modified: Wed, 23 Aug 2017 09:21:59 GMT
ETag: "7f3cdedd668a9e441dc3a72f6bcf791a"
Accept-Ranges: bytes
Server: AmazonS3
X-Cache: Miss from cloudfront
Via: 1.1 39d343f70d4ae3c992fb92c90e2bb741.cloudfront.net (CloudFront)
X-Amz-Cf-Id: TkQIRlmFhzCWTQDdUETXJlZBFSI7qysH0_COp1y-TKOnGS1_qlgM7g==
S3をオリジンにしてCloudFrontを使っているのでCloudFrontのURLをcurlでリクエストしていますが、もちろんS3のURLでも大丈夫です。
1. フォルダを選択してメタデータを変更する
2. Cache-Control
max-age=604800
を追加する
静的なリソースのキャッシュの有効期間は 1 週間以上にしてください。
https://developers.google.com/speed/docs/insights/LeverageBrowserCaching
特に理由がない場合は、上記の記述に従って 604800秒 = 7日 を設定すれば良いかなと思います。
3. CloudFrontを利用している場合は、キャッシュを削除する
CloudFrontを利用してる場合は、キャッシュが効いてしまうのでキャッシュをクリアします。
Create invalidation
をクリック後にURLを入れます。
すべてのディレクトリ以下を対象とするので /*
とします・
/uploads/hoge/*
などのように階層を限定したりしても良いです。
in progress
が completed
になれば完了です。
最初と同じコマンドで Cache-Control
が含まれているか確認します。
$ curl -I https://hoge.cloudfront.net/path/file_name.jpg
HTTP/1.1 200 OK
Content-Type: image/png
Content-Length: 4029
Connection: keep-alive
Date: Wed, 23 Aug 2017 14:04:16 GMT
Last-Modified: Wed, 23 Aug 2017 09:21:59 GMT
ETag: "7f3cdedd668a9e441dc3a72f6bcf791a"
Cache-Control: max-age=604800 # これ
Accept-Ranges: bytes
Server: AmazonS3
X-Cache: Miss from cloudfront
Via: 1.1 39d343f70d4ae3c992fb92c90e2bb741.cloudfront.net (CloudFront)
X-Amz-Cf-Id: TkQIRlmFhzCWTQDdUETXJlZBFSI7qysH0_COp1y-TKOnGS1_qlgM7g==
さいごに
すべてのディレクトリ以下のオブジェクトのメタデータを変更するのは怖かったので、僕の場合はディレクトリを限定して上記のプロセスを一通り試した後で、すべての階層以下のオブジェクトにCache-Controlをつけました。
とくに事故らなかったので良かったです。