S3にアップした画像が表示されない

はじめに

こちらの記事でなんとかS3への画像アップロードを実装したものの、なぜか表示がされない・・・というエラーにぶつかりましたのでメモを残していきます。

エラー内容

　S3へのアップは問題なくできており、表示ができないというパターンです。
S3のバケットから保存されたファイルの詳細をみていきます。
オブジェクトURLをクリックするとこんな表示がされました。

調べてみると、どうやら画像へのアクセス許可がされていないようです。解消するためにはバケットポリシーを編集していく必要があります。

バケットポリシーの編集

　バケット名をクリックして、アクセス許可のタブをクリックするとこんな画面が出てきます。

編集を押すと編集画面へ遷移します。
記入の仕方はこちらの公式ページから確認することができます。
今回の場合は匿名ユーザーに読み取り専用権限を付与することでなんとかなりそうです。
このように書いていきます。

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "PublicRead",
            "Effect": "Allow",
            "Principal": "*",
            "Action": [
                "s3:GetObject",
                "s3:GetObjectVersion"
            ],
            "Resource": "arn:aws:s3:::バケット名/*”
        }
    ]
}

この時、自分で作ったバケット名をResourceに入れるようにしてください。

終わりに

無事に表示することができました！