ひよっこエンジニアの雑多な日記スマートフォン用の表示で見るひよっこエンジニアの雑多な日記とあるプログラミングスクールで働くひよっこエンジニアが覚えたことや悲しみを記すブログ2018-04-21【Rails】ActiveStorageを使ってお手軽にファイルアップロードを試す最近ぼちぼちアウトプットしようとせこせこインプットしています。前回Rails5.2でたからActionCable試すという舐めた記事を書きましたが、今日はRails5.2で標準搭載されるようになったActiveStorageを試します!ActiveStorageとはActiveStorageはRails5.2から標準で搭載されるようになったファイルアップローダーです。S3などのクラウドストレージへのアップロードも設定で手軽に実装できる代物です。GitHub今日はこのActiveStorageを使って簡単な画像も投稿できる機能を作ります。newでサンプルアプリプロジェクトをつくります。postgresqlプロジェクトができたらGemfile内のmini_magickのコメントアウトを外します。画像処理のために導入するためです。installでインストールしておきます。これで導入に必要なものは整いました。ActiveStorageをインストールするActiveStorageを使うためにはまずインストールのコマンドを実行します。db:migrateを実行しておきましょう。生成されるテーブルは以下の二つになります。作成日時ActiveStorageの設定を確認するファイルの格納先はconfig/storage.ymlで設定されています。%>例えばlocalの設定を使えばプロジェクトルートにあるstorageディレクトリ配下にファイルを格納するという意味になります。次にconfig/environments/development.rbをみてみます。:localという記載があり格納先にconfig/storage.ymlで定義したlocalの設定を使うよという設定が書いてあります。これで設定の確認は完了です。ファイルアップロードする画面を作るまずは画像アップロードできるようにUserモデルを作ります。name:stringActiveStorageを扱う際は画像アップロード用のカラムを定義する必要はありません。db:migrateを実行します。Userモデルができたら、ActiveStorageを使うための記述を追記しておきます。追記endこの追記を行うことでUserモデルにavatarという画像を扱う属性が付与されます。has_oneがあればhas_manyもあります。has_many_attachedを利用すれば複数画像を扱うこともできます。ガイドActionStorageを使うための記載はだいたい終了なので、あとはざっと画面などを作成します。いう感じですごく簡単に画像アップロードが実装できてしまいます!S3にアップロードできるようにするS3でバケットを作るせっかくなのでS3にアップロードできるようにしてみます。S3で適当な名前のバケットを作成します。(わかりやすくactive-storage-sampleというバケットを作りました)作成したらS3を操作できるIAMユーザーを作成してアクセスキーとシークレットキーを取得しておきましょう。格納先の設定をS3に向くように変更するconfig/storage.ymlの以下のコメントアウトを外します。active-storage-sampleconfig/environments/development.rbで先ほどlocalとなっていることを確認した設定をamazonに変更します。:localを:amazonに変更またS3へのアップロードを行うためにaws-sdk-s3を導入します。Gemfileに以下を追記しましょう。installしておきます。アプリケーションからS3につなぎこむアプリケーションからS3につなぎこむためにIAMユーザーを作成して取得したアクセスキーとシークレットキーを設定しましょう。Rails5.2からcredentialsという機密情報を暗号化する機能が追加されています。これを使ってアクセスキーとシークレットキーを設定します。credentials:editこれを実行するとエディタ(この記載だとvim)が開いてキーを設定できます。エディタが開いたら以下のように設定を記載します。記載したら保存して閉じます。するとconfig/credentials.yml.encというファイルとconfig/master.keyというファイルができています。config/credentials.yml.encは暗号化されているので内容を見ることはできません。暗号化のキーにはconfig/master.keyに記載されているキーが使用されています。credentials:showを実行すれば生のデータを確認することができます。:access_key_id)という記載がありましたが、これはcredentialsのawsのaccess_key_idを取得するという記載になります。ここまで設定できれば画像を保存した際にローカルではなくS3にファイルが格納されるようになっています。クラウドストレージへのアップロードも少ない手順で実現できてしまうのはお手軽で素晴らしいですね。ちなみにconfig/master.keyやRAILS_MASTER_KEYの取り扱い間違えて消してしまったりすると、credentialsの複合ができなくなり詰んでしまうので注意しましょう。credentials:editで1から設定し直すと持ち直せる可能性があります(個人開発に限る。チーム開発だとハラキリしかないかもしれない)最後にActiveStorage手軽で便利なのですが、バリデーションやキャッシュの機能を持ち合わせていないとどこかでみたのでアップロード時にファイルチェックが必要な要件があったりすると扱いにくいかもしれません。00:20【Rails】ActiveStorageを使ってお手軽にファイルアップロードを試すTweet関連記事2019-01-08Railsでソーシャルログインを作る(Yahoo編)あけましておめでとうございます。LambdaでSinatraを動かしてみる12月から晴れてWebエンジニアになりました。いうことでアウ...2018-06-15【Rails】Webpackerを導入してモダンなJavaScriptをRailsで使う今回はWebpackerの導入について書いていきます。LambdaでSinatraを動かしてみるプログラミングスクール勤めのエンジニアが転職するってよ月別アーカイブはてなブログをはじめよう!kimurayspさんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。