AWS S3 のファイルにCLIを使ってキャッシュ設定した時にハマったこと


<h2>背景（読み飛ばし可）</h2>

Wordpressにアップロードが画像を、絡新婦等を使ってAWSのS3に連携した時に、Google のPage Speed Insight で下記のようなメッセージが出ることがあります。

![Kobito.JYHzhb.png](https://qiita-image-store.s3.amazonaws.com/0/98133/d382393e-cd66-307f-0f7e-52d9ba0ec503.png "Kobito.JYHzhb.png")


※「ブラウザのキャッシュを活用」せよと出てくるのですが、Wordpressのキャッシュ設定で .htaccess ファイルを修正すればよい！と一生懸命キャッシュの設定をしても解消されません。（画像の保存先はS3なので当たり前です。恥ずかしながら自分ハマってました。）

<h4><b><b>対応策</b></b></h4>

AWSのコンソール画面からS3の画像ファイルを開き、プロパティの中のメタデータで、「Cache-Contorol」キーに、”max-age=25200”などの値を追加

![Kobito.uI3Ct5.png](https://qiita-image-store.s3.amazonaws.com/0/98133/5c88c0e3-3f4e-3712-9288-b075fc213f9f.png "Kobito.uI3Ct5.png")



<h4><b>課題</b></h4>

ただ、これを1000本以上の画像ファイルに対して行うのは現実的じゃない。そこで、CLIの登場。コマンドラインインターフェースを使って、一括でプロパティ設定を更新しようという魂胆です。

CLIとは
https://aws.amazon.com/jp/cli/
http://docs.aws.amazon.com/cli/latest/reference/s3/index.html
CLIのインストール方法
http://docs.aws.amazon.com/cli/latest/userguide/installing.html#install-bundle-other-os



<h2>本題</h2>


CLIを使った時にハマったことが2つ。


<h4><b>1. cp のオプション[--cache-control <value>]が効かない</b></h4>
<h4><b>2. CLIで更新した後に、webブラウザで画像が表示されなくなった</b></h4>
  


<h2>1.cp のオプション[--cache-control <value>]が効かない</h2>


<h4><b>入力コマンド</b></h4>

`$ aws s3 cp (画像フルパス) （画像フルパス） --cache-control "max-age=25200"`



<h4><b>エラーメッセージ</b></h4>

```
A client error (InvalidRequest) occurred when calling the CopyObject operation: This copy request is illegal because it is trying to copy an object to itself without changing the object's metadata, storage class, website redirect location or encryption attributes.
```



<h4><b>対応策</b></h4>

CLIコマンドに オプション --metadata-directive を追記 (リファレンスにちゃんと書いてありました。)

`$ aws s3 cp (画像フルパス) （画像フルパス） --metadata-directive "REPLACE" --cache-control "max-age=25200"`


<h4><b> 具体的なvalueは下記参考 </b></h4>

Options > --metadata-directive (string) 
[AWS S3 CLI Reference](http://docs.aws.amazon.com/cli/latest/reference/s3/cp.html "AWS S3 CLI Reference")



<h4><b>結果</b></h4>

S3のコンソールでプロパティを確認すると、キャッシュ設定が反映されているはずです。
![Kobito.XAcLqr.png](https://qiita-image-store.s3.amazonaws.com/0/98133/3e4dbcac-d849-eadc-f68a-1b1749ca2d23.png "Kobito.XAcLqr.png")


<h2>2.CLIで更新した後にwebアクセスしたら画像が表示されなくなった</h2>
上記で行ったキャッシュ設定ですが、ブラウザで確認してみると画像が表示されなくなってしまいました。

<h4><b>エラー画面</b></h4>
![Kobito.MtfBFb.png](https://qiita-image-store.s3.amazonaws.com/0/98133/f9ddb4b0-d94e-5db8-b866-c4fb67f4b677.png "Kobito.MtfBFb.png")


<h4><b>原因</b></h4>
S3のコンソールでプロパティを確認すると、アクセス許可の設定がありません（CLIによって上書き削除されてしまっている）

エラー時の画像リンクをブラウザで開くと、”AccessDenied”と表示されるはずです。

![Kobito.ZKc7TI.png](https://qiita-image-store.s3.amazonaws.com/0/98133/b400ff50-e36b-788f-cb50-2673f135246e.png "Kobito.ZKc7TI.png")


<h4><b>対応策</b></h4>
CLIコマンドに オプション --acl <value> を追記

`$ aws s3 cp (画像フルパス) （画像フルパス） --metadata-directive "REPLACE" --cache-control "max-age=25200" --acl public-read`


<h4><b>具体的なvalueは下記参考</b></h4>
Options > --acl (string)

[AWS S3 CLI Reference](http://docs.aws.amazon.com/cli/latest/reference/s3/cp.html "AWS S3 CLI Reference")


<h4><b>結果</b></h4>
S3のコンソールでプロパティ確認すると
![Kobito.AnKom8.png](https://qiita-image-store.s3.amazonaws.com/0/98133/b9f6ea78-48ca-c4b7-1e22-ee83821f77d4.png "Kobito.AnKom8.png")


ブラウザで画像リンクを開くと、無事画像が表示されているはずです。


<h2>最後に</h2>

以上、S3のCLIを使用した時にハマったことのご共有でした。

なお、オプションで --recursive を追記して上げればディレクトリ単位で一括でプロパティの更新が可能なので、便利です。

`$ aws s3 cp (画像ディレクトリ) （画像ディレクトリ） --metadata-directive "REPLACE" --cache-control "max-age=25200" --acl public-read --recursive`



記載に誤りあればコメントください。