【Rails】AWSのS3を使ってHerokuで画像を投稿できるようにする方法

1. Ruby
2020/09/11

1. AWSアカウントの作成

AWS公式のアカウント作成の流れを参考に、アカウントを作る。

2. IAMユーザーを作成する

ダッシュボードから「IAM」を選択

ログインできたら、ダッシュボードから「IAM」を選択。

左側のメニューから「ユーザー」を選択。

「ユーザーを追加」を選択。

ユーザー名を入力し、「プログラムによるアクセス」にチェックを入れる。

「既存のポリシーを直接アタッチ」を選択し、「AmazonS3FullAccess」にチェックを入れる。

タグの設定に関しては何もしないで次のページへ。

ここも何もしない。

後々使うため、CSVファイルをダウンロードしておく。これでIAMユーザーの作成は完了。

3. バケットを作成

TOP画面から「S3」をクリックする。

「バケットを作成する」をクリックする。

バケット名を入力しリージョン（地域）は「東京」を選択する。（既に使われているバケット名は使えない）

「プロパティ」の設定に関しては何もしないで次のページへ。

一番上の「パブリック…」のチェックを外し、下の2つの「新規の…」と「任意の…」にチェックを入れる。

確認画面が表示されるので「バケットを作成」をクリック。これでAWS上での作業は完了。

4. CA証明書を設置する

$ CERT_PATH=$(ruby -ropenssl -e "puts OpenSSL::X509::DEFAULT_CERT_FILE")

$ sudo curl "https://curl.haxx.se/ca/cacert.pem" -o $CERT_PATH

SSL接続で使用するCA証明書を設置するために、上のコマンドを叩く。

これをやっておかないと、ファイルをアップした時にエラーが起きる可能性があるらしい。

5. Gemをインストール

gem "aws-sdk-s3", require: false

SDKのgemが必要なので、Gemfileに追記。

bundle install

コマンドを叩いてインストールする。

6. 資格情報を編集

先ほど得たアクセスキーを設定していく。

アクセスキーは先ほどダウンロードしたCSVファイルに記述されている。（左がアクセスキーID、右がシークレットアクセスキー）

$ EDITOR=vim rails credentials:edit

秘密情報を管理するためのcredentials.ymlを編集していく。

aws:
  access_key_id: (アクセスキーID)
  secret_access_key: (シークレットアクセスキー)

先ほど得たアクセスキーたちを当てはめつつ、上の設定を追記する。（最初からコメントアウトされている場合もある）

7. 画像の保存先をS3に変更する

amazon:
  service: S3
  access_key_id: <%= Rails.application.credentials.dig(:aws, :access_key_id) %>
  secret_access_key: <%= Rails.application.credentials.dig(:aws, :secret_access_key) %>
  region: # アクセスキーID
  bucket: # バケット名

config/storage.ymlに、上のように追記する。（スペース1つの差でエラーになるため注意が必要）

8. development.rbに追記

config.active_storage.service = :amazon

config/environments/development.rbに、上のように追記する。

9. マスターキーをセットする

config/master.keyを開き、そこにある文字列をコピーする。

$ heroku config:set RAILS_MASTER_KEY= <取得した文字列>

そしてその文字列を当てはめつつ、上のコマンドを叩く。

$ heroku buildpacks:add -i 1 https://github.com/heroku/heroku-buildpack-activestorage-preview

そして上のコマンドを叩く。

10. デプロイ＆マイグレーション

$ git add .
$ git commit -m "s3 edit"
$ git push heroku master
$ heroku run rails db:migrate

最後にデプロイとマイグレーションをすれば完了。

エラーの対処法

「Application error」と表示される場合

「Application error」

デプロイ後にそのURLにアクセスし、上のようにエラーとなった場合。

$ heroku logs --tail

でログを見たり

$ heroku run rails c

でコンソールを起動してあげると、エラーの原因が分かることが多い。

images内の画像が表示されない場合

「Heroku下で投稿した画像ではなく、assets/images内にある画像が表示されない」という場合。

config.assets.compile = false
config.assets.compile = true

config/environments/development.rbをこのように修正すれば解決するかも。

¹²

参考