Cloud9を使ってCarrierwaveで複数画像をアップロードする方法。

Carrierwaveを使って、複数の写真をアップロードするやり方については既にネット上に沢山出ていますが、まっさらのCloud9上に構築して色々いじってみたかったので自分用のメモとして残してみたいと思います。

目標 : Carrierwaveを使って1度に複数の写真をアップロードしたい！

開発環境:Cloud9

※環境構築とcarrierwaveのセッティングが終わってる場合は、1と2は飛ばしてください。

1: Cloud9で開発環境を構築する。

わからない方は、Rails Tutorialさんにcloud9を使った環境構築のやり方があるので、それを参考にgem rails -v 5.1.4をインストール、rails newをしてyay! You're on Rails!の画面が出る状態にしていきます。

2:Carrierwaveのセッティングをする。

次にcarrierwaveをセッテイングしていきます。今回は、こちらを参考にさせてもらいました。

RailsのファイルをアップロードするgemのCarrierWaveのインストール方法 - Rails Webook

上記のサイト通りにコピペして進めると写真を1枚だけアップロードできるようになっていると思います。こちらを参考にまんま進めていきます(productモデルがある状態)

3:写真を複数アップロード出来るように変更する。

前工程で1枚の写真をアップロード出来るようになったのでこれを複数に変更していきます。

公式サイトにMultiple file uploadsについて記載があるのでこれを参考にします。

 Product.rb

モデルを変更します。mount_uploadersとserialize :image, JSONに変更します。

_form.html.erb

<%= f.file_field  :image %>に :multiple => true (35行目)を追加、image_tagの部分を変更します(28~30行目)。formだと長いので、f.の形に直しました。

products_controller.rb

product_paramsを変更します。:imageを{image: []}に変更します(73行目)。

show.html.erb

_form.html.erb同様に、こちらもimage_tagを変更します（19〜21行目)

完成  

うまくいくと、複数アップロードが完成すると思います。

※間違いや誤字などありましたら、スイマセン。