DragonFly 附件和 BackBone.js

Question

我正在尝试使用 BackBone.js 将图像附加到模型，在 Rails 中一切正常。

但是对于 BackBone.js，我不知道如何附加图像，例如在显示模板中显示它。

正如你将在我得到的要点中看到的那样 None of the functions registered with #<Dragonfly::Analyser:0x000000028e2d60> were able to deal with the method call format(<Dragonfly::TempObject data="img2.jpg" >). You may need to register one that can.

这是我在 BB.js 模板中使用的形式：

<form id="new_album" enctype="multipart/form-data">
  <input type="text" name="name" id="new_album_name">
  <input type="file" name="cover_image" id="new_album_cover_image" >
  <input type="submit" value="Add">
</form>

这就是我得到的：https://gist.github.com/4105311

这里是 GitHub 上的完整 repo：https://github.com/enricostano/FullstackAlbum

编辑

添加remotipart gem 并像这样更改表单

<form id="new_album" method="post" enctype="multipart/form-data" data-remote="true" data-type="json">
  <input type="text" name="name" id="new_album_name">
  <input type="file" name="cover_image" id="new_album_cover_image" >
  <input type="submit" value="Add">
</form>

我现在得到了这个 Rails 日志

Started POST "/api/albums" for 127.0.0.1 at 2012-11-19 11:06:20 +0100
Processing by AlbumsController#create as JSON
  Parameters: {"name"=>"caricati", "cover_image"=>"img2.jpg", "album"=>{"cover_image"=>"img2.jpg", "name"=>"caricati"}}
   (0.1ms) begin transaction
None of the functions registered with #<Dragonfly::Analyser:0x0000000265c550> were able to deal with the method call format(<Dragonfly::TempObject data="img2.jpg" >). You may need to register one that can.
  SQL (0.5ms) INSERT INTO "albums" ("cover_image_uid", "created_at", "name", "updated_at") VALUES (?, ?, ?, ?) [["cover_image_uid", "2012/11/19/11_06_20_434_file"], ["created_at", Mon, 19 Nov 2012 10:06:20 UTC +00:00], ["name", "caricati"], ["updated_at", Mon, 19 Nov 2012 10:06:20 UTC +00:00]]
   (256.8ms) commit transaction
Completed 201 Created in 303ms (Views: 1.8ms | ActiveRecord: 257.4ms)
cache: [POST /] invalidate, pass


Started POST "/" for 127.0.0.1 at 2012-11-19 11:06:20 +0100
Processing by AlbumsController#index as JSON
  Parameters: {"cover_image"=>#<ActionDispatch::Http::UploadedFile:0x007f95e878c1b8 @original_filename="img2.jpg", @content_type="image/jpeg", @headers="Content-Disposition: form-data; name=\"cover_image\"; filename=\"img2.jpg\"\r\nContent-Type: image/jpeg\r\n", @tempfile=#<File:/tmp/RackMultipart20121119-5822-hq8kbi>>, "name"=>"caricati", "remotipart_submitted"=>"true", "X-Requested-With"=>"IFrame", "X-Http-Accept"=>"application/json, text/javascript, */*; q=0.01"}
WARNING: Can't verify CSRF token authenticity
  Album Load (0.2ms) SELECT "albums".* FROM "albums"
Completed 200 OK in 2ms (Views: 1.0ms | ActiveRecord: 0.2ms)

当我上传文件时 DragonFly 在文件系统 2 文件中创建： 12_37_59_129_file 和 12_37_59_129_file.meta

第一个（应该是我上传的文件）包含我刚刚上传的文件的名称。

Answer 1

看起来实际的文件数据没有被提交，因为您通过 Backbone 使用 AJAX 而不是常规的表单提交。如果您想以这种方式提交文件数据，您应该考虑使用类似 FileReader API 或 iframe 的方法来模拟 AJAX。