LoginSignup
27
39

More than 3 years have passed since last update.

S3の設定(Ruby + Heroku + carrierwave )

Posted at

herokuで画像の投稿をawsのs3に保存する。

IAM ユーザーの作成

AWSへのアカウント登録後、S3を利用できるようにします。
まずは、S3を利用することのみの権限を持ったユーザーアカウントを設定します。
(ログインしているユーザーの権限は一番強いもの(root)です。AWS上の、どんな操作でもできてしまいます。もしこのアカウントを不正利用されたら、高額な請求が来てしまうこともあります。そんな困ったことにならないよう、root権限のユーザーを使うのをやめましょう。代わりに、使える機能が制限された別のユーザーを作成します。)

  • 検索のフォームにIAMと打ち込みIAMページに移動。 スクリーンショット 2019-05-14 20.30.15.png
  • ユーザーの管理をクリック スクリーンショット 2019-05-14 20.31.42.png
  • ユーザーを追加をクリック スクリーンショット 2019-05-14 20.34.20.png
  • IAMでのユーザー名を入力、プログラムによるアクセスにチェック スクリーンショット 2019-05-14 20.35.06.png
  • その後の移行ページで既存の”既存のポリシーを直接アタッチ”をクリック。
  • "AmazonS3FullAccess”にチェック。 スクリーンショット 2019-05-14 20.35.56.png
  • ここは何も入力せずに次のページに スクリーンショット 2019-05-14 20.40.38.png
  • 確認画面 スクリーンショット 2019-05-14 20.41.25.png
  • ユーザーが作成された。※CSVをダウンロードしておく。
    後でIAMユーザーとしてアクセス設定するACCESS_KEY_ID、SECRET_ACCESS_KEYが入っている。
    $ heroku config:set S3_ACCESS_KEY_ID=""
    $ heroku config:set S3_SECRET_ACCESS_KEY=""
    スクリーンショット 2019-05-14 20.45.33.png

  • 上記で作成されたIAMユーザー名をクリックして認証情報をクリック
    スクリーンショット 2019-05-14 20.54.24.png

  • 下記の通りにチェック
    スクリーンショット 2019-05-14 20.54.35.png

  • CSVをダウンロード
    スクリーンショット 2019-05-14 20.54.43.png

  • 引き続き2段階認証のための設定 MFAデバイスの割り当てをクリック
    スクリーンショット 2019-05-14 21.01.13.png

2段階認証アプリのAuthy(オウシー)とリンクさせる。
(QRコードをAuthyで読み込んだら同期しAuthyが発行したワンタイムパスワードで認証できる)

  • IAMのコンソールのログインできるか確認しておく コンソールのサインインリンクにURLあるので、そちらをクリック

S3で保存先を準備

  • サービスに戻りS3をクリック

  • バケットを作成するをクリック(保存先を準備)
    スクリーンショット 2019-05-14 21.10.10.png

  • バケット名(自作アプリ名と同名が分かりやすい)と東京を選択。
    スクリーンショット 2019-05-14 21.12.12.png

  • 設定は入れずに次のページに
    スクリーンショット 2019-05-14 21.14.02.png

  • 下2つにチェック
    セキュリティの設定。今回はバケットポリシーを使用してセキュリティ設定を行いますので下の2つにチェックを入れます。ここの設定が過っているとファイルのアップロードができなくなりますので注意。
    バケットポリシーとは
    どのようなアクセスに対してS3への読み書きを許可するか決めることができる仕組み。今回は、作成したIAMユーザーからのアクセスのみを許可するよう設定していきます。

スクリーンショット 2019-05-14 21.15.03.png

  • バケットポリシーの設定 下記の場所で設定 スクリーンショット 2019-05-14 21.23.47.png

下記のように記述する。

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "statement1",
            "Effect": "Allow",
            "Principal": {
                "AWS": "arn:aws:iam::<あなたのAWS12桁のID>:user/<あなたのIAMユーザー名>"
            },
            "Action": "*",
            "Resource": "arn:aws:s3:::<あなたのバケット名>/*"
        }
    ]
}

こちらの内容はIAMユーザー情報欄にあるのでコピペ
"AWS": "arn:aws:iam::<あなたのAWS12桁のID>:user/<あなたのIAMユーザー名>"

スクリーンショット 2019-05-14 21.20.55.png

gem 'carrierwave'
gem 'rmagick'
gem 'fog-aws'

Ruby側の設定

Herokuでの画像の保存先をAmazon S3に保存できるように設定

config/initializers/carrierwave.rb(環境変数はheroku上で入れる)
# 下記の三行は入れていた方がいいらしい
require 'carrierwave/storage/abstract'
require 'carrierwave/storage/file'
require 'carrierwave/storage/fog'

if Rails.env.production?
  CarrierWave.configure do |config|
    config.fog_provider = 'fog/aws'
    config.fog_credentials = {
      # Amazon S3用の設定
      provider: 'AWS',
      region: ENV['AWS_S3_REGION'],
      aws_access_key_id: ENV['AWS_IAM_ACCESS_KEY_ID'],
      aws_secret_access_key: ENV['AWS_IAM_ACCESS_KEY'],
    }
    config.fog_directory     =  ENV['AWS_S3_BUCKET']
    config.fog_attributes = { cache_control: "public, max-age=#{365.days.to_i}" }
  end

  # 日本語ファイル名の設定
  CarrierWave::SanitizedFile.sanitize_regexp = /[^[:word:]\.\-\+]/
end

aws_access_key_id・・・awsのIAMのaccesskey
aws_secret_access_key・・・awsのIAMのsecretaccesskey
config.fog_directory・・・バケット名
config.asset_host・・・https://s3.リージョン名.amazonaws.com/バケット名

app/uploaders/image_uploader.rb(追加箇所のみ抜粋)
  if Rails.env.development?
    storage :file
  elsif Rails.env.test?
    storage :file
  else
    storage :fog
  end

herokuへ環境変数登録

コマンドからherokuに環境変数を登録(IAMでCSVダウンロードした中身通りに値を入力)
REGIONはS3で登録した地域。
東京ならap-northeast-1

$ heroku config:set AWS_S3_REGION="ap-northeast-1"
$ heroku config:set AWS_IAM_ACCESS_KEY_ID="IAMのACCESS_KEY_IDを入力"
$ heroku config:set AWS_IAM_ACCESS_KEY="IAMのACCESS_KEYを入力"
$ heroku config:set AWS_S3_BUCKET="S3のバケット名を入力"

以上でherokuへデプロイして画像を投稿しS3のバケットに保存されるか確認。

最後に
できるまでに色々と試行錯誤して8時間を要した。
色々と記事を見ながらおこなったが、微妙に記述が違いうまく行ったのが下記の記事の設定だった。
大きな違いはなく、どこがどのように影響していたのかわからないがとりあえず実現したいことは達成できた。

参考にさせていただいた記事(記事のエラーと設定は私の方では関係ありませんでした。設定のみを参考)
https://qiita.com/yukiyukimiyaiwa/items/a9e0103c8342b81f6ac1

27
39
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
27
39