Rails 4 - Kendo UI ImageBrowser成功上传但未定义的缩略图

Question

我正在使用Rails 4中的自定义CMS集成Kendo UI编辑器。除了上传新图像后的错误外，一切似乎都有效。 选择要上传的图像后，ImageBrowser会添加一个新项目并显示“正在上传”圈子。首先，它在圆圈附近显示图像的文件名，然后它变为未定义。

但是，如果我关闭ImageBrowser然后再次打开它，缩略图就会按预期显示，没有错误。如果我在控制器中人为地产生错误，则在创建操作结束时，Kendo ImageBrowser中会出现错误弹出窗口（带有404或500），如果我在点击确定按钮之前稍等一下，则点击后缩略图也按预期存在。

所以我猜两件事：

1. 我没有在创建操作结束时为ImageBrowser提供正确/预期的响应。 （试图渲染与我为transport.read渲染相同的json，但问题仍然存在）。 在这种情况下，我的问题是：Kendo ImageBrowser期待什么样的响应？
2. 上传/处理/调整图片大小需要花费时间，而剑道要求太快（因此得到“未定义”结果），并且不会再“询问”。 在这种情况下，我的问题是：如何/何时延迟或再次调用读取以正确显示新上传的图像的缩略图，而不会返回未定义？

有任何解决此问题的建议吗？或者在Kendo UI方面是错误吗？

来自输出的Heres片段：

Started POST "/kezelo/assets" for 127.0.0.1 at 2014-01-17 18:09:33 +0100
Processing by Kezelo::AssetsController#create as */*
  Parameters: {"file"=>#<ActionDispatch::Http::UploadedFile:0x007fa78bb00b00 @tempfile=#<Tempfile:/var/folders/90/wjyhxjfs3gz3xkhsk8z_sz2w0000gn/T/RackMultipart20140117-49102-5lwwh4>, @original_filename="100_3048.JPG", @content_type="image/jpeg", @headers="Content-Disposition: form-data; name=\"file\"; filename=\"100_3048.JPG\"\r\nContent-Type: image/jpeg\r\n">, "path"=>"", "authenticity_token"=>"sdKhe348x26hm0k8kirzHlYgmH1LN73wf3ZWyOA5PHY="}
   (0.1ms)  begin transaction
  SQL (0.7ms)  INSERT INTO "assets" ("created_at", "image_file_size", "kendo_type", "photo", "updated_at") VALUES (?, ?, ?, ?, ?)  [["created_at", Fri, 17 Jan 2014 17:09:35 UTC +00:00], ["image_file_size", 247716], ["kendo_type", "f"], ["photo", "100_3048.JPG"], ["updated_at", Fri, 17 Jan 2014 17:09:35 UTC +00:00]]
   (1.6ms)  commit transaction
  Asset Load (0.4ms)  SELECT "assets".* FROM "assets"
Completed 200 OK in 1416ms (Views: 29.7ms | ActiveRecord: 2.7ms)


Started GET "/uploads/assets/undefined" for 127.0.0.1 at 2014-01-17 18:09:35 +0100

ActionController::RoutingError (No route matches [GET] "/uploads/assets/undefined"):
  actionpack (4.0.2) lib/action_dispatch/middleware/debug_exceptions.rb:21:in `call'
  actionpack (4.0.2) lib/action_dispatch/middleware/show_exceptions.rb:30:in `call'
  railties (4.0.2) lib/rails/rack/logger.rb:38:in `call_app'
  railties (4.0.2) lib/rails/rack/logger.rb:20:in `block in call'
  activesupport (4.0.2) lib/active_support/tagged_logging.rb:67:in `block in tagged'
  activesupport (4.0.2) lib/active_support/tagged_logging.rb:25:in `tagged'
  activesupport (4.0.2) lib/active_support/tagged_logging.rb:67:in `tagged'
  railties (4.0.2) lib/rails/rack/logger.rb:20:in `call'
  actionpack (4.0.2) lib/action_dispatch/middleware/request_id.rb:21:in `call'
  rack (1.5.2) lib/rack/methodoverride.rb:21:in `call'
  rack (1.5.2) lib/rack/runtime.rb:17:in `call'
  activesupport (4.0.2) lib/active_support/cache/strategy/local_cache.rb:83:in `call'
  rack (1.5.2) lib/rack/lock.rb:17:in `call'
  actionpack (4.0.2) lib/action_dispatch/middleware/static.rb:64:in `call'
  rack (1.5.2) lib/rack/sendfile.rb:112:in `call'
  railties (4.0.2) lib/rails/engine.rb:511:in `call'
  railties (4.0.2) lib/rails/application.rb:97:in `call'
  rack (1.5.2) lib/rack/lock.rb:17:in `call'
  rack (1.5.2) lib/rack/content_length.rb:14:in `call'
  rack (1.5.2) lib/rack/handler/webrick.rb:60:in `service'
  /usr/local/rvm/rubies/ruby-2.0.0-p247/lib/ruby/2.0.0/webrick/httpserver.rb:138:in `service'
  /usr/local/rvm/rubies/ruby-2.0.0-p247/lib/ruby/2.0.0/webrick/httpserver.rb:94:in `run'
  /usr/local/rvm/rubies/ruby-2.0.0-p247/lib/ruby/2.0.0/webrick/server.rb:295:in `block in start_thread'


  Rendered /usr/local/rvm/gems/ruby-2.0.0-p247/gems/actionpack-4.0.2/lib/action_dispatch/middleware/templates/rescues/_trace.erb (1.4ms)
  Rendered /usr/local/rvm/gems/ruby-2.0.0-p247/gems/actionpack-4.0.2/lib/action_dispatch/middleware/templates/routes/_route.html.erb (4.4ms)
  Rendered /usr/local/rvm/gems/ruby-2.0.0-p247/gems/actionpack-4.0.2/lib/action_dispatch/middleware/templates/routes/_table.html.erb (1.4ms)
  Rendered /usr/local/rvm/gems/ruby-2.0.0-p247/gems/actionpack-4.0.2/lib/action_dispatch/middleware/templates/rescues/routing_error.erb within rescues/layout (47.9ms)

我的传输读取网址是（使用dataType：json）：

http://localhost:3000/kezelo/assets

以上网址的json输出：

[{"id":21,"name":"MAP_0528.JPG","type":"f","size":573896},{"id":22,"name":"MAP_0565.JPG","type":"f","size":646608},{"id":24,"name":"MAP_0667.JPG","type":"f","size":370408},{"id":26,"name":"mami_a_kertben.JPG","type":"f","size":364433},{"id":28,"name":"15kg_os.jpg","type":"f","size":975517},{"id":29,"name":"MAP_0257.jpg","type":"f","size":357723},{"id":31,"name":"DSC_0113.JPG","type":"f","size":574744},{"id":33,"name":"DSC_0062.JPG","type":"f","size":287631},{"id":34,"name":"100_2997.JPG","type":"f","size":126418},{"id":35,"name":"100_2999.JPG","type":"f","size":364433},{"id":36,"name":"100_3002.JPG","type":"f","size":340892},{"id":37,"name":"100_3025.JPG","type":"f","size":199709},{"id":38,"name":"100_3005.JPG","type":"f","size":435145},{"id":39,"name":"100_3019.JPG","type":"f","size":152869},{"id":40,"name":"100_3033.JPG","type":"f","size":208811},{"id":41,"name":"100_3039.JPG","type":"f","size":264420},{"id":42,"name":"100_3048.JPG","type":"f","size":247716}]

Answer 1

问题解决了。我的第一个猜测是对的。我没有为Kendo ImageBrowser提供适当的响应。 它只需要以json格式上传的图像数据，如下所示：

{"name":"new_image_name","type":"f","size":646608} 

现在它就像一个魅力！ 这种集成中最棘手的事情是为Kendo提供合适的json输出。对于那些想在他们的应用程序中使用此编辑器的人，请查看acts_as_api gem。它会缓解你的痛苦。