はじめに

前回の記事の続きです。

kykt35.hatenablog.com

Rails 5.2で追加されたActive Storageを使って、画像をクラウドストレージのAmazon S3にアップロードするの設定についてまとめます。

Amazon S3の設定

Amazon S3(Amazon Simple Storage Service)は、Amazon Web Service(AWS)で提供されているストレージサービスです。

https://aws.amazon.com/jp/

まずは、AWSにアカウントログインしアプリのバケットを作成します、次にアクセスするユーザーを登録しアクセスキーとパスワードを取得します。
作成したバケットの情報とアクセスキーとパスワードをRailsのcrediential.ymlに登録します。

バケットの作成

AWSのコンソールにログインし、サービスタブからストレージ＞S3を選択します。

Amazon S3の画面でバケットを作成をクリックします。 S3サービス画面

バケット名(例：sample-app-bucket)を入力し、次へをクリックします。バケット作成

特に必要がなければ、そのまま次へをクリックします。バケット作成

チェックを全て外します。アクセス許可設定は、今回は行いません。

確認して、バケットの作成をクリックします。バケット作成

IAMユーザーの作成

アプリからS3へアクセスするIAMユーザーを作成します。 AWSのサービスタブから、IAMを選択します。

IAMページのユーザーをクリックします。 IAM

ユーザー画面のユーザーを追加をクリックします。 IMAユーザー画面

ユーザー名(例：sample-app)を入力し、プログラムによるアクセスにチェックを入れます。 IAMユーザーを追加

既存のポリシーを直接アタッチをクリックする。入力欄にs3と入力すると関連するポリシーが表示されるので、AmazonS3FullAccessにチェックを入れる。 IAMポリシー

今回は特に必要がないので、そのまま次へのステップをクリックします。 IAMタグ

確認して、ユーザーを作成をクリックします。 IAM確認画面

ユーザーが作成され、アクセスキーとシークレットアクセスキーが表示ます。
これをメモするか、csvのダウンロードをクリックして保存します。 IAMユーサー作成完了

画像保存先の設定

次に、S３へアップロードするためのRailsの設定を行います。

production.rbの編集

今回は本番環境のみS３にアップロードし、開発およびテスト環境ではローカルに保存する設定にします。

config/emviroments/production.rbを編集して、ActiveStorageの保存先を":local"から":amazon"に変更します。

#config/emviroments/production.rb

  config.active_storage.service = :amazon

ちなみに、開発環境でもS3にアップしたい場合は、config/emviroments/development.rbをおなじように変更します。

storege.ymlの編集

保存先の情報をstorege.ymlに記載します。config/storage.ymlの１０行目から１５行目のコメントを解除してamazonの設定を有効にします。regionとbucketには先ほど作成したS３のバケットのリージョン名とバケット名を入力します。ちなみに東京リージョンはap-northeast-1になります。

#config/storege.yml

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: ap-northeast-1
  bucket: your_own_bucket

crediential.yml.enc

アクセスキーとシークレットアクセスキーは、crediential.yml.encから読み込む設定になっているのでここで設定します。
crediential.yml.encはアクセスキーなどの機密性の高い情報を暗号化して保存できる機能でRails5.2から追加されました。

ターミナルで以下を実行し、crediential.yaml.encを編集します。

EDITOR="vim" bin/rails credentials:edit

EDITOR="vim"は初回のみ必要になります。また、vim以外のエディターを使う場合はここで指定をします。

エディターが立ち上がると以下の部分をコメント解除し、access_key_idとsecret_access_keyに取得したアクセスキーとシークレットアクセスキーを入力します。

aws:
    access_key_id: your_access_key_id
    secret_access_key: your_secret_access_key

＊注意＊ crediential.yaml.encは、master.keyファイルをつかって暗号化しています。暗号化しているのでGitHubなどで共有することが可能ですが、master.key(正確にはファイル内の文字列)の管理は厳重にしましょう。

gemの追加

最後に必要なgemを追加し、bunndle installを実行します。

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

確認

ためしにローカル環境でS3にアップロードしてみます。
config/emviroments/development.rbを編集して保存先を変更します。

#config/emviroments/development.rb

  config.active_storage.service = :amazon

アプリを起動して、適当な画像をアップロードしてみます。 f:id:kykt35:20190219011110p:plain

作成したS3のバケットにアクセスして画像がアップされているか確認します。 f:id:kykt35:20190219011248j:plain ランダムなファイル名のファイルが追加されているのが確認できます。これはActiveStorageがアップロードする際に付与したkey属性になります。

ファイルをクリックした画面で、開けるをクリックします。 f:id:kykt35:20190219012141j:plain

アップロードした画像が表示されました。 f:id:kykt35:20190219012653p:plain

まとめ

ActiveStorageでS３にアップロードする手順をまとめました。
S３の設定とRailsの設定だけで実装できるので本当に楽です。

kykt35’s diary

ActiveStorageを使った複数画像アップロードアプリを作る -S3へのアップロード