Rails 4 ภาพหรือไฟล์อัพโหลดโดยใช้ carrierwave

Question 1

ฉันจะอัปโหลดภาพหลายภาพจากหน้าต่างการเลือกไฟล์โดยใช้ Rails 4 และ CarrierWave ได้อย่างไร ฉันมีแบบจำลองpost_controllerและ post_attachmentsฉันจะทำเช่นนี้ได้อย่างไร?

ใครช่วยยกตัวอย่างได้ไหม มีวิธีง่ายๆในการนี้หรือไม่?

Question 2

นี่คือวิธีการอัปโหลดหลายภาพโดยใช้คลื่นพาหะในราง 4 ตั้งแต่เริ่มต้น

หรือคุณสามารถค้นหาการสาธิตการใช้งานได้: รางแนบหลายตัว 4

โดยทำตามขั้นตอนต่อไปนี้

rails new multiple_image_upload_carrierwave

ในไฟล์ gem

gem 'carrierwave'
bundle install
rails generate uploader Avatar

สร้างโครงโพสต์

rails generate scaffold post title:string

สร้างโครงแบบ post_attachment

rails generate scaffold post_attachment post_id:integer avatar:string

rake db:migrate

ใน post.rb

class Post < ActiveRecord::Base
   has_many :post_attachments
   accepts_nested_attributes_for :post_attachments
end

ใน post_attachment.rb

class PostAttachment < ActiveRecord::Base
   mount_uploader :avatar, AvatarUploader
   belongs_to :post
end

ใน post_controller.rb

def show
   @post_attachments = @post.post_attachments.all
end

def new
   @post = Post.new
   @post_attachment = @post.post_attachments.build
end

def create
   @post = Post.new(post_params)

   respond_to do |format|
     if @post.save
       params[:post_attachments]['avatar'].each do |a|
          @post_attachment = @post.post_attachments.create!(:avatar => a)
       end
       format.html { redirect_to @post, notice: 'Post was successfully created.' }
     else
       format.html { render action: 'new' }
     end
   end
 end

 private
   def post_params
      params.require(:post).permit(:title, post_attachments_attributes: [:id, :post_id, :avatar])
   end

ในมุมมอง / โพสต์ / _form.html.erb

<%= form_for(@post, :html => { :multipart => true }) do |f| %>
   <div class="field">
     <%= f.label :title %><br>
     <%= f.text_field :title %>
   </div>

   <%= f.fields_for :post_attachments do |p| %>
     <div class="field">
       <%= p.label :avatar %><br>
       <%= p.file_field :avatar, :multiple => true, name: "post_attachments[avatar][]" %>
     </div>
   <% end %>

   <div class="actions">
     <%= f.submit %>
   </div>
<% end %>

เพื่อแก้ไขไฟล์แนบและรายการไฟล์แนบสำหรับโพสต์ใด ๆ ในการดู / โพสต์ / show.html.erb

<p id="notice"><%= notice %></p>

<p>
  <strong>Title:</strong>
  <%= @post.title %>
</p>

<% @post_attachments.each do |p| %>
  <%= image_tag p.avatar_url %>
  <%= link_to "Edit Attachment", edit_post_attachment_path(p) %>
<% end %>

<%= link_to 'Edit', edit_post_path(@post) %> |
<%= link_to 'Back', posts_path %>

อัปเดตแบบฟอร์มเพื่อแก้ไขมุมมองไฟล์แนบ/ post_attachments / _form.html.erb

<%= image_tag @post_attachment.avatar %>
<%= form_for(@post_attachment) do |f| %>
  <div class="field">
    <%= f.label :avatar %><br>
    <%= f.file_field :avatar %>
  </div>
  <div class="actions">
    <%= f.submit %>
  </div>
<% end %>

แก้ไขวิธีการอัพเดตในpost_attachment_controller.rb

def update
  respond_to do |format|
    if @post_attachment.update(post_attachment_params)
      format.html { redirect_to @post_attachment.post, notice: 'Post attachment was successfully updated.' }
    end 
  end
end

ในราง 3 ไม่จำเป็นต้องกำหนดพารามิเตอร์ที่รัดกุมและในขณะที่คุณสามารถกำหนด attribute_accessible ได้ทั้งในโมเดลและ accept_nested_attribute เพื่อโพสต์โมเดลเนื่องจากแอตทริบิวต์สามารถเข้าถึงได้ถูกเลิกใช้ในราง 4

สำหรับการแก้ไขไฟล์แนบเราไม่สามารถแก้ไขไฟล์แนบทั้งหมดได้ในคราวเดียว ดังนั้นเราจะแทนที่ไฟล์แนบทีละไฟล์หรือคุณสามารถแก้ไขได้ตามกฎของคุณที่นี่ฉันจะแสดงวิธีอัปเดตไฟล์แนบ

Question 3

ถ้าเราดูเอกสารของ CarrierWave ตอนนี้มันง่ายมาก

https://github.com/carrierwaveuploader/carrierwave/blob/master/README.md#multiple-file-uploads

ฉันจะใช้ผลิตภัณฑ์เป็นรูปแบบที่ฉันต้องการเพิ่มรูปภาพดังตัวอย่าง

รับ Carrierwave สาขาหลักและเพิ่มลงใน Gemfile ของคุณ:
```
gem 'carrierwave', github:'carrierwaveuploader/carrierwave'
```
สร้างคอลัมน์ในโมเดลที่ต้องการเพื่อโฮสต์อาร์เรย์ของรูปภาพ:
```
rails generate migration AddPicturesToProducts pictures:json
```
เรียกใช้การย้ายข้อมูล
```
bundle exec rake db:migrate
```

เพิ่มรูปภาพให้กับรุ่นสินค้า

app/models/product.rb

class Product < ActiveRecord::Base
  validates :name, presence: true
  mount_uploaders :pictures, PictureUploader
end

เพิ่มรูปภาพให้กับพารามิเตอร์ที่แข็งแกร่งใน ProductsController
```
app/controllers/products_controller.rb

def product_params
  params.require(:product).permit(:name, pictures: [])
end
```

อนุญาตให้แบบฟอร์มของคุณยอมรับหลายภาพ

app/views/products/new.html.erb

# notice 'html: { multipart: true }'
<%= form_for @product, html: { multipart: true } do |f| %>
  <%= f.label :name %>
  <%= f.text_field :name %>

  # notice 'multiple: true'
  <%= f.label :pictures %>
  <%= f.file_field :pictures, multiple: true, accept: "image/jpeg, image/jpg, image/gif, image/png" %>

  <%= f.submit "Submit" %>
<% end %>

ในมุมมองของคุณคุณสามารถอ้างอิงรูปภาพที่แยกวิเคราะห์อาร์เรย์รูปภาพ:
```
@product.pictures[1].url
```

หากคุณเลือกหลายภาพจากโฟลเดอร์ลำดับจะเป็นลำดับที่แน่นอนที่คุณถ่ายจากบนลงล่าง

Question 4

การเพิ่มเติมเล็กน้อยสำหรับคำตอบSSR :

Accept_nested_attributes_forไม่ต้องการให้คุณเปลี่ยนตัวควบคุมของอ็อบเจ็กต์หลัก ดังนั้นถ้าจะแก้ไข

name: "post_attachments[avatar][]"

ถึง

name: "post[post_attachments_attributes][][avatar]"

จากนั้นการเปลี่ยนแปลงตัวควบคุมทั้งหมดเหล่านี้จะกลายเป็นซ้ำซ้อน:

params[:post_attachments]['avatar'].each do |a|
  @post_attachment = @post.post_attachments.create!(:avatar => a)
end

นอกจากนี้คุณควรเพิ่มลงPostAttachment.newในฟอร์มออบเจ็กต์หลัก:

ในมุมมอง / โพสต์ / _form.html.erb

  <%= f.fields_for :post_attachments, PostAttachment.new do |ff| %>
    <div class="field">
      <%= ff.label :avatar %><br>
      <%= ff.file_field :avatar, :multiple => true, name: "post[post_attachments_attributes][][avatar]" %>
    </div>
  <% end %>

สิ่งนี้จะทำให้การเปลี่ยนแปลงนี้ซ้ำซ้อนในคอนโทรลเลอร์ของผู้ปกครอง:

@post_attachment = @post.post_attachments.build

สำหรับข้อมูลเพิ่มเติมโปรดดูRails fields_for form ไม่แสดงขึ้นรูปแบบซ้อนกัน

หากคุณใช้ Rails 5 ให้เปลี่ยนRails.application.config.active_record.belongs_to_required_by_defaultค่าจากtrueเป็นfalse(ใน config / initializers / new_framework_defaults.rb) เนื่องจากบั๊กภายในaccept_nested_attributes_for ( โดยทั่วไปแล้วaccept_nested_attributes_forจะไม่ทำงานภายใต้ Rails 5)

แก้ไข 1:

หากต้องการเพิ่มเกี่ยวกับการทำลาย :

ในรุ่น / post.rb

class Post < ApplicationRecord
    ...
    accepts_nested_attributes_for :post_attachments, allow_destroy: true
end

ในมุมมอง / โพสต์ / _form.html.erb

 <% f.object.post_attachments.each do |post_attachment| %>
    <% if post_attachment.id %>

      <%

      post_attachments_delete_params =
      {
      post:
        {              
          post_attachments_attributes: { id: post_attachment.id, _destroy: true }
        }
      }

      %>

      <%= link_to "Delete", post_path(f.object.id, post_attachments_delete_params), method: :patch, data: { confirm: 'Are you sure?' } %>

      <br><br>
    <% end %>
  <% end %>

ด้วยวิธีนี้คุณไม่จำเป็นต้องมีตัวควบคุมวัตถุลูกเลย! ฉันหมายความว่าไม่มีความPostAttachmentsControllerจำเป็นอีกต่อไป สำหรับคอนโทรลเลอร์ของอ็อบเจ็กต์พาเรนต์ ( PostController) คุณแทบจะไม่เปลี่ยนมันเลย - สิ่งเดียวที่คุณเปลี่ยนคือรายการพารามิเตอร์ที่อนุญาตพิเศษ (รวมพารามิเตอร์ที่เกี่ยวข้องกับอ็อบเจ็กต์ลูก) ดังนี้:

def post_params
  params.require(:post).permit(:title, :text, 
    post_attachments_attributes: ["avatar", "@original_filename", "@content_type", "@headers", "_destroy", "id"])
end

นั่นเป็นเหตุผลที่accepts_nested_attributes_forน่าทึ่งมาก

Question 5

นอกจากนี้ฉันยังหาวิธีอัปเดตการอัปโหลดไฟล์หลายไฟล์และฉันก็ปรับโครงสร้างใหม่อีกเล็กน้อย รหัสนี้เป็นของฉัน แต่คุณได้รับการล่องลอย

def create
  @motherboard = Motherboard.new(motherboard_params)
  if @motherboard.save
    save_attachments if params[:motherboard_attachments]
    redirect_to @motherboard, notice: 'Motherboard was successfully created.'
  else
    render :new
  end
end


def update
  update_attachments if params[:motherboard_attachments]
  if @motherboard.update(motherboard_params)
    redirect_to @motherboard, notice: 'Motherboard was successfully updated.'
  else
   render :edit
  end
end

private
def save_attachments
  params[:motherboard_attachments]['photo'].each do |photo|
    @motherboard_attachment = @motherboard.motherboard_attachments.create!(:photo => photo)
  end
end

 def update_attachments
   @motherboard.motherboard_attachments.each(&:destroy) if @motherboard.motherboard_attachments.present?
   params[:motherboard_attachments]['photo'].each do |photo|
     @motherboard_attachment = @motherboard.motherboard_attachments.create!(:photo => photo)
   end
 end

Question 6

นี่คือ refactor ตัวที่สองของฉันในโมเดล:

ย้ายเมธอดส่วนตัวไปยังโมเดล
แทนที่ @ เมนบอร์ดด้วยตัวเอง

ตัวควบคุม:

def create
  @motherboard = Motherboard.new(motherboard_params)

  if @motherboard.save
    @motherboard.save_attachments(params) if params[:motherboard_attachments]
  redirect_to @motherboard, notice: 'Motherboard was successfully created.'
  else
    render :new
  end
end

def update
  @motherboard.update_attachments(params) if params[:motherboard_attachments]
  if @motherboard.update(motherboard_params)
    redirect_to @motherboard, notice: 'Motherboard was successfully updated.'
  else
    render :edit
  end
end

ในรุ่นเมนบอร์ด:

def save_attachments(params)
  params[:motherboard_attachments]['photo'].each do |photo|
    self.motherboard_attachments.create!(:photo => photo)
  end
end

def update_attachments(params)
  self.motherboard_attachments.each(&:destroy) if self.motherboard_attachments.present?
  params[:motherboard_attachments]['photo'].each do |photo|
    self.motherboard_attachments.create!(:photo => photo)
  end
end

Question 7

เมื่อใช้การเชื่อมโยง@post.post_attachmentsคุณไม่จำเป็นต้องตั้งค่าpost_id.