jQuery Remotipart将[object Object]发送到服务器

Question

我正在尝试使用ajax将文件上传到我的Rails应用程序.为了促进这一点,我已经包含了jQuery.remotipart gem.

// app/assets/javascripts/application.js
//= require jquery.remotipart

我有一个上传文件的表格.这些文件由CarrierWave处理.

<%= form_for @import, remote: true do |f| %>
  <fieldset>
    <%= f.label :file, "Attach a CSV file" %>
    <%= f.file_field :file %>
  </fieldset>
  <%= f.submit :upload %>

<% end -%>

不幸的是,当我提交附有文件的表单时,它似乎没有正确地到达我的控制器操作.params hash将JS对象字符串化为键.

Started POST "/file_imports" for 127.0.0.1 at 2012-11-06 01:00:49 +0000
Processing by FileImportsController#create as JS
  Parameters: {"object Object"=>{","=>{"object Object"=>{","=>{"object Object"=>nil}}}}}`

在Chrome的开发工具中,我可以看到这确实是发送到服务器的表单数据:

当我删除时,表单完美地工作remote: true(当然,在这种情况下,它发送HTML请求而不是JS请求).

任何人都知道我做错了什么？顺便说一下,我使用的是Rails 3.2.8和Remotipart 1.0.2(最新版).

编辑:做了一些挖掘.

看看Remotipart的来源,我似乎无法理解它应该做什么.例如,在vendor/assets/javascripts/jquery.remotipart.js第22行中有以下内容:

settings.data = form.serializeArray();

再向下,设置将通过发送到服务器$.rails.ajax(settings).

该$.fn.serializeArray()方法返回一个JS对象数组.如果我们将它们分配给调用的数据属性jQuery.ajax(),那将考虑我在服务器上看到的序列化对象参数.我们需要传递一个对象作为数据属性,而不是一个对象数组？

但是,当我尝试将数组展平为一个对象时,整个事情就会中断并且HTML请求被发送到服务器而不是JS服务器.我认为这与事实有关jQuery.ajax.processData == false.

我在Remotipart Github上有一个问题.

Answer 1

经过大量的调试和阅读大量代码后,我终于获得了使用Rails 3.2.8的最新gem.我被三个陷阱钉了:

(1)我在表单提交之前禁用了我的文件输入字段,这导致remotipart忽略它以包含在iframe提交中.您必须确保已启用文件输入.这是您看到的错误的直接原因.

(2)在我的调试过程中,我覆盖jquery.iframe-transport了最新的上游源,并且它不支持X-Http-Acceptsiframe中的隐藏变量.您必须使用与remotipart gem捆绑在一起的版本.

(3)如果你使用的是非数据类型,请不要忘记连接ajax的回调:在表单上完成script.如果未在全局ajax选项中指定dataType,或者在表单上使用data-type属性,则这是缺省值.