複数の画像を表示できないです

Question

https://gyazo.com/6bb8d731146016c8e7489140d424e722
上はスクショです
undefined method `each' for #ImageUploader:0x00007f50440dd180
Extracted source (around line #15):
13
14
15
16
17
18

  <div class="feature-image">
    <% @information.image.each do |image| %>
      <%= image_tag(@information.image_url) %>
    <% end %>
  </div>

というエラーが出てしまいます

http://arthurxxx.hatenablog.com/entry/2018/02/05/234638
このサイトを参考にし、複数の画像を投稿できるようにしようと思いました
以下imageに関係するものだけ載せさせていただきます

show.html.erb

<div class="feature-image">
        <% @information.image.each do |image| %>
          <%= image_tag(@information.image_url) %>
        <% end %>
      </div>

new.html.erb

<div class="pv4">
  <%= render 'form', information: @information %>
</div>

_form.html.erb

<div class="field">
          <div class="control">
            <label class="label">Add images</label>
              <div class="file">
              <label class="file-label">
                <%= f.input :image, as: :file, input_html: { class:"file-input instrument-image" }, label: false, wrapper: false, :multiple => true %>
                  <span class="file-cta">
                    <span class="file-icon"><i class="fa fa-upload"></i></span>
                    <span class="file-label">Choose a file…</span>
                  </span>
              </label>
              </div>
            </div>
          </div>
          <output id="list"></output>
        <hr />

マイグレーションファイル

class AddImageToInformation < ActiveRecord::Migration[5.2]
  def change
    add_column :information, :image, :string
  end
end

information.rb

mount_uploader :image, ImageUploader
  serialize :image, JSON

となっています。教えてください！

さらに:imageを{image: []}とするとNil location provided. Can't build URI.となってしまいます（show,indexページで）

Answer 1

エラーを見る限り、
undefined method each 　となっておりますので、

show.html.erb に記載されております

@information.image

にて、informationに紐づく、imageが取得できていないように思えます。

参考にされてます、サイトのリンクの内容を確認しましたところ、
carrierwave の Multiple file uploadsの手順にて
アップロードを行っているように見受けられます。

取り急ぎ、エラーを解決したいだけなのであれば、
参考サイトのように

show での画像の呼び出しの前に、

<% if @information.image.present? %>
  <div class="feature-image">
    <% @information.image.each do |image| %>
      <%= image_tag(@information.image_url) %>
    <% end %>
  </div>
<% end %>

という感じに、条件を付け加えることで、回避できそうです。

ですが、
undefindが返ってきているので、
画像のアップロード自体ができているのか、データベースなどを確認してみると
更に、解決に近づけるかもしれません。

Comments

[c.koki]

回答ありがとうございます。
rails cで調べてみたところ
params.require(:information).permit(:condition, :title, :description, :image)の部分を{image: []}とすると
<Information id: 16, condition: "New", title: "k", description: "l", created_at: "2019-06-09 05:08:43", updated_at: "2019-06-09 05:08:43", image: nil, user_id: 2>,のようにimageが保存されず
:imageとすると#<Information id: 17, condition: "New", title: "image", description: "i", created_at: "2019-06-09 05:14:20", updated_at: "2019-06-09 05:14:20", image: "stevejobs.jpg", user_id: 2>]> のようにimageが保存されます。なぜそうなってしまうのかわかりません。教えていただけないでしょうか？

[fshun]

上記は、controller 内で許可する パラメータ部分の記述の認識で問題ないでしょうか。

確かに、1回目の方法では、保存できていないように見えますね。。。
2回目の方法だと、ファイル名が取れているので、最低限保存されているようには、見えますね。

ちなみに、
strong parameter 内にて、

` {image: []} ` と記述するのは、なぜか理解していますでしょうか。

使用しているデータベースは、なにを使用していますでしょうか。

続けての複数質問申し訳ないです。
一緒に問題解決ができれば幸いです????

[c.koki]

お忙しい中、返信ありがとうございます！

database.ymlを見ると以下のようになっていますproduction.sqlite3だと思います
# SQLite version 3.x
# gem install sqlite3
#
# Ensure the SQLite 3 gem is defined in your Gemfile
# gem 'sqlite3'
#
default: &default
adapter: sqlite3
pool: <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>
timeout: 5000

development:
<<: *default
database: db/development.sqlite3

# Warning: The database defined as "test" will be erased and
# re-generated from your development database when you run "rake".
# Do not set this db to the same as development or production.
test:
<<: *default
database: db/test.sqlite3

production:
adapter: postgresql
encoding: unicode
pool: 5
database: db/production.sqlite3

strong parameter 内にて、

` {image: []} ` と記述するのは、なぜか理解していますでしょうか。

あまりよくわかりませんが、:imageだと一つの画像しか受け取れなからでしょうか？

回答お願いします。

[fshun]

データベースの確認ありがとうございます。

> あまりよくわかりませんが、:imageだと一つの画像しか受け取れなからでしょうか？
イメージは、そうですね ! 画像が複数枚選択されて、飛んでくるので、配列を許可するというイメージです!!!

さて、問題の方なのですが、画像が1枚だとアップロードができ、
期待する動きはしているのでしょうか。

[c.koki]

はい、画像一枚だとできています。
ただ画像一枚でも{image: []とするとデータベースに保存されません

[fshun]

なるほどです。
どのようなパラメータが飛んできているか、デバッグしてみるのはどうでしょう。

[c.koki]

28: def create
29: binding.pry
=> 30: @information = current_user.informations.build(information_params)
31:
32: respond_to do |format|
33: if @information.save
34: format.html { redirect_to @information, notice: 'Information was successfully created.' }
35: format.json { render :show, status: :created, location: @information }
36: else
37: format.html { render :new }
38: format.json { render json: @information.errors, status: :unprocessable_entity }
39: end
40: end
41: end

[1] pry(#<InformationController>)> params
=> <ActionController::Parameters {"utf8"=>"✓", "authenticity_token"=>"oCTON7UMEGmATrPY4ZUbEeECbeDjACLMKIPzxbJKSWgFu1EB7+aWpMb+/Yf48hT+H9AgRuiGsnh2zEY0ftCSdA==", "information"=>{"title"=>"image", "description"=>"image params", "condition"=>"New", "image"=>#<ActionDispatch::Http::UploadedFile:0x00007f6a4c20eaa0 @tempfile=#<Tempfile:/tmp/RackMultipart20190610-5370-1q3wiug.jpg>, @original_filename="IMG_1827 2.jpg", @content_type="image/jpeg", @headers="Content-Disposition: form-data; name=\"information[image]\"; filename=\"IMG_1827 2.jpg\"\r\nContent-Type: image/jpeg\r\n">}, "commit"=>"Create Information", "controller"=>"information", "action"=>"create"} permitted: false>

デバッグしてみたところpermitの部分でfalseになってしまっているということがわかったのですが、なぜfalseになるのかがわかりません。

[fshun]

ありがとうございます。

` params ` だけの取得だと、通常は permittedは falseになっていると思います。
それらを許可するために、strong parameter で指定するというイメージです。

` information_params ` は、どのようになっているでしょう。

また、上記の pry のケースは、画像は1枚だけでしょうか。

[c.koki]

一つの画像の時です
28: def create
29: binding.pry
=> 30: @information = current_user.informations.build(information_params)
31:
32: respond_to do |format|
33: if @information.save
34: format.html { redirect_to @information, notice: 'Information was successfully created.' }
35: format.json { render :show, status: :created, location: @information }
36: else
37: format.html { render :new }
38: format.json { render json: @information.errors, status: :unprocessable_entity }
39: end
40: end
41: end

[1] pry(#<InformationController>)> information_params
Unpermitted parameter: :image
=> <ActionController::Parameters {"condition"=>"New", "title"=>"image", "description"=>"image"} permitted: true>

28: def create
29: binding.pry
=> 30: @information = current_user.informations.build(information_params)
31:
32: respond_to do |format|
33: if @information.save
34: format.html { redirect_to @information, notice: 'Information was successfully created.' }
35: format.json { render :show, status: :created, location: @information }
36: else
37: format.html { render :new }
38: format.json { render json: @information.errors, status: :unprocessable_entity }
39: end
40: end
41: end

[1] pry(#<InformationController>)> information_params
Unpermitted parameter: :image
=> <ActionController::Parameters {"condition"=>"Fair", "title"=>"image", "description"=>"a"} permitted: true>
複数の画像の時です

def information_params
params.require(:information).permit(:condition, :title, :description, {image: []})
end
としていますがUnpermitted parameter: :imageとなってしまいます

[fshun]

ありがとうございます。

少し気になったのですが、
`information.rb` の `mount_uploader :image, ImageUploader` の部分を

` `information.rb` の `mount_uploaders :image, ImageUploader` としても
意味なさそうでしょうか????

[c.koki]

返信ありがとうございます。
28: def create
29: binding.pry
=> 30: @information = current_user.informations.build(information_params)
31:
32: respond_to do |format|
33: if @information.save
34: format.html { redirect_to @information, notice: 'Information was successfully created.' }
35: format.json { render :show, status: :created, location: @information }
36: else
37: format.html { render :new }
38: format.json { render json: @information.errors, status: :unprocessable_entity }
39: end
40: end
41: end

[1] pry(#<InformationController>)> information_params
Unpermitted parameter: :image
=> <ActionController::Parameters {"condition"=>"Fair", "title"=>"イメージ", "description"=>"s"} permitted: true>

変わらないみたいです

[fshun]

お手数おかけしますが、
画像を複数枚選択した際の ` params ` の内容を
記載してみていただいても、よろしいでしょうか????

[c.koki]

返信ありがとうございます
こうなります
[1] pry(#<InformationController>)> params
=> <ActionController::Parameters {"utf8"=>"✓", "authenticity_token"=>"tzeLGrQQ0hDRaaNFmyOXpMO9bvD+geZzyHe1Al1k1icSqBQs7vpU3ZfZ7RqCRJhLPW8jVvUHdseWOADzkf4NOw==", "information"=>{"title"=>"q", "description"=>"a", "condition"=>"New", "image"=>#<ActionDispatch::Http::UploadedFile:0x00007f5e2c405a88 @tempfile=#<Tempfile:/tmp/RackMultipart20190611-4342-2zmwj9.jpg>, @original_filename="IMG_1827 2.jpg", @content_type="image/jpeg", @headers="Content-Disposition: form-data; name=\"information[image]\"; filename=\"IMG_1827 2.jpg\"\r\nContent-Type: image/jpeg\r\n">}, "commit"=>"Create Information", "controller"=>"information", "action"=>"create"} permitted: false>

[fshun]

遅くなり、申し訳ございません。

上記の パラメータは、複数枚選択していますでしょうか。。
パット見た感じでは、1枚しか飛んできていないように、見えました????

[c.koki]

返信遅くなりすいません。
無事解決しました。
ありがとうございます