Dropzonejs 和 Paperclip、url 和 paramName？

Question

如果您要自定义放置区，我不明白 URL 和 paramName 应该是什么？

Dropzone.autoDiscover = false
$('#new_picture').dropzone
  url: '/projects'
  maxFilesize: 1
  paramName: 'project_images[photos]'
  addRemoveLinks: true

我很确定我的 paramName 和 url 是错误的。

我有这样嵌套的回形针：

<%= simple_form_for @project, html: { multipart: true } do |f| %>
  <div class='dropzone' id="new_picture">
    <div class="fallback">
      <%= file_field_tag "photos[]", multiple: true %>
    </div>
  </div>
<% end %>

我有一个 project_image.rb

class ProjectImage < ActiveRecord::Base

  belongs_to :project
  has_attached_file :photo, 
                    :styles => { 
                        :large => "800x800>", 
                        :thumb => "150x150#" }, 
                    :default_url => "/images/:style/missing.png"
  validates_attachment_content_type :photo, content_type: /\Aimage\/.*\Z/
  attachment :file

end

我的参数在 projects_controller.rb 中看起来像这样

def project_params
  params.require(:project).permit(
    :user_id,
    project_images_attributes: [:id, :project_id, :photo, :_destroy])
end

只是为了展示我创建的样子

def create
  @project = Project.new(project_params)

  respond_to do |format|
    if @project.save

      if params[:photos]
        params[:photos].each { |image|
          @project.project_images.create(photo: image)
        }
      end
    end
  end
end

Answer 1

实际上，url 是在您的 form 未定义任何操作时指定的。我已经像这样使用dropzone.js：

= form_tag new_drag_drop_photo_path, method: :post, class: "dropzone form-horizontal", id: "media-dropzone", :authenticity_token => true do
  = file_field_tag "photo", multiple: true

现在，当照片被拖放到我的 dropzone 字段中时，它将被发送到定义如下的操作：

Started POST "/new_drag_drop_photo" for 127.0.0.1 at 2015-07-24 10:55:04 +0530
Processing by PhotosController#new_drag_drop_photo as JSON
  Parameters: {"utf8"=>"✓", "authenticity_token"=>"rmp7BwrEoa7iCesuPifQm60YwAemDCfq6t7soQ==", "file"=>#<ActionDispatch::Http::UploadedFile:0x007f6b78ab5190 @tempfile=#<Tempfile:/tmp/RackMultipart20150724-4280-1obqg7k.jpg>, @original_filename="bridal-dresses-4.jpg", @content_type="image/jpeg", @headers="Content-Disposition: form-data; name=\"file\"; filename=\"bridal-dresses-4.jpg\"\r\nContent-Type: image/jpeg\r\n">}

所以现在你没有使用form，而是使用div，这就是为什么你需要定义url，拖动时照片将被发送到哪里。这将是一个json 请求，dropzone 将期待来自服务器的json 响应。所以你需要一个控制器的动作，就像我指定的那样：

def new_drag_drop_photo
    @photo = Photo.new(image: params[:file], name: params[:file].original_filename.split('.')[0])
    if @photo.save!
      respond_to do |format|
        format.json{ render :json => @photo }
      end
    else
      render json: { error: @photo.errors.full_messages.join(',')}, :status => 400
    end
  end

现在我从文件本身中获取filename。当你在 dropzone 配置中提供这样的：paramName: 'project_images[photos]' 时，它将在文件发送到控制器的操作时传递此名称。由于您在这里使用了嵌套形式，我也使用了它，但是我使用了一些 jquery 来向其中添加 photo_ids。所以我要做的是先上传照片并保存在数据库中，然后以嵌套形式分配 id。

希望这会有所帮助。