#はじめに
私のオリジナルサービスの画像投稿機能にrefileを使用したので、簡単にまとめておきたいと思います。
つまづいたところとかも記載しておくので、参考になれば幸いです。
#refileの導入
##gem
いくつかQiitaやブログなどで参考記事はありますが、gemをinstallできないもののいくつか見受けられました。
githubに記載されている github/refile
gem "refile", require: "refile/rails"
gem "refile-mini_magick"
↑この記述方法ではbundle install できませんでした。(環境によっては変わるのか?)
なので、私はこの記事(refile使い方)を参考にして、
gem "refile", require: "refile/rails", github: 'manfe/refile'
gem "refile-mini_magick"
としました。そして
$ bundle install
で追加したgemをインストールします。
次にgithubを参考にしていくと
We're requiring both Refile's Rails integration and image processing via the MiniMagick gem, which requires ImageMagick (or GraphicsMagick) to be installed. To install it simply run:
と書かれており、ImageMagickをインストールする必要があると言われているので、
$ sudo apt-get install imagemagick
とします。
(僕の場合、 apt-get を yum に直して、 imagemagick を ImageMagick に変更するとインストールできました。ちなみにAWSのcloud9で開発しています。)
##model
インストールが終わったら、次は画像投稿機能を追加したいmodelに
class User < ActiveRecord::Base
attachment :image_id
end
attachment :画像を入れたいカラム名 + _id
を追記します。
_id
の説明についてはまた後でしますので、ひとまずつけておいてください。
##カラムの追加
カラムの追加は rails g migration add_(追加したいカラム名+_id)_to_追加するモデル名 (追加したいカラム名+_id):型
とします。
$ rails generate migration add_image_id_to_users image_id:string
ポイントは (追加したいカラム名+_id)
←これです。
refileの決まりで、先ほどの attachment :
くっつけるカラムには _id
が必要になります。
なので、さきほどのmodelでも出てきましたが、カラム名には _id
をつけてあげてください。
##View
次は画像投稿用のフォームを作成します。 <%= form.attachment_field :カラム名 %>
で投稿用のフォームが完成します!
ややこしいですが、ここでのカラム名には _id
はいりません。
<%= form_for @user do |form| %>
<%= form.attachment_field :profile_image %>
<% end %>
##Controller
次はストロングパラメータに先ほど追加したカラムをpermit(許可)してあげないといけません。
ここでも _id
は必要なし。
def user_params
params.require(:user).permit(:name, :email, image ←これを追加)
end
##View
これで最後です。画像を表示したいところに
<%= image_tag attachment_url(@user, :image, :fill, 300, 300, format: "jpg") %>
のように追記してあげるだけです!ここでも _id
は必要なし。
この :fill, 300, 300
の部分で縦横幅を決めれます。(が、レスポンシブ対応にするならCSSとかで指定した方がいいかも?)
これで投稿した画像が表示されるはずです!
#まとめ
実際、なにもわからない時に画像投稿機能をつけたいな〜と思いながらQiitaの記事を漁ってましたが、ほとんど分からずにかなり苦戦しました…。
なので、初心者の方にもわかるようにできるだけ詳しく解説してみました。
ポイントはなんども出てきた _id
かな〜と個人的には思います。
#参考記事
正直どんな記事よりもうるぞーさんのyoutubeを見るのが手っ取り早いです。ほんと神。
ほとんどこの動画を参考にしてました。ありがとうございます。