minimagickで合成した画像を表示したい
解消したいこと
本番環境でs3に保存した画像を表示したい。
現状
rails7でcrudアプリを作成しております。
fly.ioでデプロイを行い、新規投稿を実行したところ画像が表示できず躓いております。現状共有のため、新規投稿の動きを記述いたします。
- 新規投稿されるまでの動き
- 新規投稿ページで画像、タイトル、本文を入力し投稿する
- 投稿された画像は、post.rbのadd_frameメソッドにあるminimagickによりs3にアップロードされているframe.pngと合成されcompose_imageとして保存される
- index.html.erbには合成された画像(compose_image)、タイトル、本文が1つの投稿として表示される
- 合成された画像の表示は
<%= image_tag post.compose_image, class: "content-image"%>というコードで表示しています。
以上の流れで新規投稿されます。
次にcompose_imageが合成できているのか、保存できているのかを確認します。
- s3に合成された画像が保存されていました。
- 以下は本番環境のdbです。compose_imageカラムに画像が保存されています。
app=# select * from posts;
id | image | body | user_id | created_at | updated_at | status | title |
compose_image
----+------------+----------+---------+----------------------------+----------------------------+--------+--------+------------------------------------
---------------------------------------------------
33 | sample.png | 09211300 | 1 | 2023-09-21 03:59:33.886476 | 2023-09-21 03:59:33.886476 | 0 | sample | https://bucket-name.s3.ap-northeast
-1.amazonaws.com/uploads/post/image/1695268773.png
(1 row)
開発者ツールで確認します。
-
要素を見ると<img class="content-image"src="https://bucket-name.s3.ap-northeast-1.amazonaws.com/uploads/post/image/1695521425.png">とあります。 -
コンソールを確認すると以下のようなエラーがあります。
GET https://bucket-name.s3.ap-northeast-1.amazonaws.com/uploads/post/image/1695521425.png 403 (Forbidden)
403エラーが出ており、このサイトにもある通り権限エラーが起こっていることがわかりました。
よって合成された画像の保存は成功しているがアクセス許可・権限がないため表示できないと判断しました。
エラーに対しての対応
そこでバケットポリシーを確認。
actionは全て許可されており、パブリックアクセスもオフになっているのでアクセスできているはず。。。
{
"Version": "2012-10-17",
"Statement": [
{
"Sid": "Stmt000001",
"Effect": "Allow",
"Principal": {
"AWS": "arn:aws:iam::xxxxxxx:user/app-name"
},
"Action": "s3:*",
"Resource": "arn:aws:s3:::bucket-name/*"
}
]
}
方針
s3の中でアクセス許可・権限が付与しきれていないところがあるのではないか。付与しきれていないものにアクセス許可・権限を与えれば表示されると考えています。
知りたいこと
・方針は合っているか。
・他の可能性はあるか。
・方針通り進める場合、バケットポリシーとパブリックアクセス以外にどこを確認すればいいのか
以上３点を質問させて頂きたく思います。
ご教示いただけると幸いです。
よろしくお願いいたします。
0
