はじめに
はじめまして、ずっと大地と申します。
2023年11月より、オンラインスクールのRUNTEQにて、未経験からのWebエンジニア転職を目指して学習をしています。
初学者のうえ、記事を書くのは初めてです。
記述漏れや作成ファイルの記載忘れなど、不備があるかもしれないので、間違いなどあれば教えて頂けたらと幸いです。
また、人によって環境の違いがあるかと思うので、あくまでも私自身の環境で、記事投稿時の記録ということをお許しください。
概要
アプリ開発にて実装した、Amazon S3での本番環境の画像アップロードについて、設定が多く難しいと感じたので、記事にしたいと思います。
CarrierWaveを導入済み、AWSにrootユーザー、IAMユーザーとしてログインできる状態を前提とします。
環境
Ruby 3.2.3
Rails 7.1.3.2
CarrierWave
Amazon S3
Render.com
手順
rootユーザーとしてサインイン
まずは、rootユーザーとしてサインインします。
右上からリージョンをアジアパシフィック（東京）にしておきます。
S3を検索
上部の検索欄からS3を検索し、S3を選びます。
バケット作成
バケット作成のボタンを押します。
AWSリージョンは、アジアパシフィック (東京) ap-northeast-1で設定、バケット名を決め、汎用を選びます。
※バケットは、簡単に言うと画像を保存する場所です。
ACLを有効にします。
下から３つの項目にチェックを入れ、他は特に変えずにスクロールしてページ下部のバケット作成ボタンを押します。
バケットポリシーの設定
作成されたバケットを選択、上部に並んでいるアクセス許可から、バケットポリシー欄の編集を押します。
バケットポリシーを編集します。
①、②、③を編集します。
編集ができたら、変更を保存を押します。
※日本語など入っていると保存できません。
{
"Version": "2012-10-17",
"Id": "Policy1544152951996",
"Statement": [
{
"Sid": "Stmt1544152948221",
"Effect": "Allow",
"Principal": {
"AWS": "arn:aws:iam::①IAMユーザー時に必要な１２桁の数字:user/②IAMユーザー名"
},
"Action": "s3:*",
"Resource": "arn:aws:s3:::③バケット名"
}
]
}
アクセスキーの取得
IAMユーザーとしてログインします。
上部の検索欄からIAMと検索し、ダッシュボードにいきます。
左側のバーからユーザーを押し、オレンジ色のユーザーの作成を押します。
ユーザー名を決めて、次へを押します。
ポリシーを直接アタッチするを選んで、AmazonS3FullAccessにチェックを入れます。s3と検索するとすぐ見つかります。
アクセスキーの発行
※ここはキーの発行なので画像を載せていません。
使いたいユーザーを選び、セキュリティ認証情報から、アクセスキーを作成を押します。
外部から...を選んで、完了を押すと、アクセスキーが発行されます。
後で.envファイルに記述するので、控えておいてください。
キーは後で表示されませんので、ご注意ください。
各設定ファイルの編集
Gemfileに下記を追記し、bundle installします。
gem "aws-sdk-s3"
config/environments/production.rbの記述を、下記のようにlocalからamazonに変更します。
#config.active_storage.service = :local
config.active_storage.service = :amazon
config/storage.ymlを以下のようにします。
環境変数になっている部分は後述します。
作成したバケット名を記述してください。
amazon:
service: S3
access_key_id: <%= ENV['AWS_ACCESS_KEY_ID'] %>
secret_access_key: <%= ENV['AWS_SECRET_ACCESS_KEY'] %>
region: ap-northeast-1
bucket: バケット名
再びGemfileに追記し、bundle installします。
gem 'fog-aws'
carrierwaveが導入してあれば、app/uploders/avatar_uploder.rbのようなファイルがあると思うので、以下のようにします。
class AvatarUploader < CarrierWave::Uploader::Base
# 略
if Rails.env.production?
storage :fog # 本番環境ではfogを使用
else
storage :file # 開発環境とテスト環境ではfileを使用
end
# 略
end
config/initializers/carrierwave.rbを作成し、以下のようにします。
コピペで問題ありませんが、①バケット名は自分のものを記述してください。
環境変数になっている部分は、config/storage.ymlと同じ記述です。
require 'carrierwave/storage/abstract'
require 'carrierwave/storage/file'
require 'carrierwave/storage/fog'
CarrierWave.configure do |config|
config.storage :fog
config.fog_provider = 'fog/aws'
config.fog_directory = '①バケット名'
config.fog_credentials = {
provider: 'AWS',
aws_access_key_id: ENV['AWS_ACCESS_KEY_ID'],
aws_secret_access_key: ENV['AWS_SECRET_ACCESS_KEY'],
region: 'ap-northeast-1',
path_style: true
}
end
.envに以下のように追記をします。
ファイルを作ったことがない方は作成してください。
ここでキーを打つことで、config/storage.ymlと、config/initializers/carrierwave.rbの環境変数が使われ、GitHubに大事な情報が上がらなくなります。
AWS_ACCESS_KEY_ID=アクセスキーを記述
AWS_SECRET_ACCESS_KEY=シークレットキーを記述
デプロイ
デプロイ先の設定にもキーを追加します。
私の場合は、Render.comなので、以下のように記載します。
デプロイします。
本番環境で画像をアップロードする実装を試します。
rootユーザーとしてログインし、バケットのオブジェクトに画像が保存されていたら実装完了です。
お疲れ様でした！！
おわりに
AWSと聞くだけで少し身構えますが、実装ができて良かったです。
実装にあたって参考にさせていただいた記事や、詰まった時に助けていただいた記事は下に載せておきます。
ここまで読んでくださり、ありがとうございました。
参考記事・引用元