Rails remotipart gem,如何绑定到ajax“progress”事件

时间:2012-10-29 03:18:36

标签: ruby-on-rails ajax

我正在尝试实现一个基于ajax事件的进度条,我已经在很多方面阅读过了。我的特殊问题是我不知道如何将自定义事件处理程序绑定到'remotipart'gem的ajax事件中。

这里描述了我想要做的甚至挂钩:

http://warp.byu.edu/site/content/1172

http://www.centurion-project.org/articles/html5-multiple-file-upload-with-progress-bar

我提到的remotipart gem:

https://github.com/JangoSteve/remotipart

我正在使用rails 3和jquery,其格式为:remote => true

1 个答案:

答案 0 :(得分:2)

Remotipart可能不是答案

这么少的免责声明,我没有自己使用Remotipart gem,但我花了很多时间处理文件上传和Rails。不幸的是,基于我对Remotipart的理解,它不会支持您正在寻找的进度条用例,因为底层iFrame传输策略不支持进度事件。

为了解释,让我们看一下在浏览器级别我们作为开发人员可用的不同选项。无论您使用哪种服务器端框架或库,这些选项都适用。

无刷新文件上传

  1. iFrame Transport
  2. 支持插件(Flash / Silverlight /其他)
  3. HTML5(文件和XHR2 API,可选择拖放)
  4. 选项1 - iFrame传输(Remotipart的战略)

    最新且最广泛支持(就浏览器而言)无刷新页面加载的策略主要涉及执行表单的标准提交,但使用隐藏的iFrame作为目标。不幸的是,此选项不支持进度事件,请参阅此链接(来自Remotipart的README):
    http://www.alfajango.com/blog/ajax-file-uploads-with-the-iframe-method/

    选项2 - 支持插件

    使用上传模块(通常用Flash或Silverlight编写)来克服历史浏览器标准带来的限制。允许多个文件上传和进度事件,但要求用户安装第三方浏览器扩展(尽管我们可以假设大多数桌面浏览器都有Flash)。

    选项3 - HTML 5(您引用的文章使用的策略)

    与往常一样,HTML 5是解决所有生活挑战的答案。使用File和XHR2 API,可以支持带有进度事件的多文件上载,而无需任何浏览器扩展。这是您引用的文章所使用的策略,通常是期待的最佳实践,但有一点需要注意,您可能会看到很多用户使用不支持它的浏览器。

    我做什么

    我是任何解决方案的忠实粉丝,让您利用最新最好的解决方案,同时在旧浏览器上优雅地降级。考虑到这一点,我使用一个名为Plupload的库来上传文件:
    http://www.plupload.com/

    Plupload在一个库中包含4个上传“运行时”:

    • HTML5(选项3)
    • Flash(选项2)
    • Silverlight(选项2)
    • HTML4(选项1)

    您可以配置您的首选顺序,Plupload JS运行时将智能地加载用户浏览器支持的第一个。无论使用哪个运行时,库的JS部分都能为您提供一致的事件来编程。作为开发人员,让我们专注于构建一个不错的UI,无论使用哪个运行时都会“正常工作”。

    当然,如果你一直降级到HTML4,你将失去获得进度更新的能力,所以你应该为此做好准备。

    希望有所帮助!如果您对使用Plupload感兴趣,可以提供很多好的文章和答案。