Fine Uploader Rails 表格

Question

我最近在我们的 Rails 应用程序中安装了 Fine Uploader。我已经阅读了文档并对其进行了一些试验，但我似乎并不了解它的实际工作原理，因此，我在实施它时遇到了很多问题。

我做了什么：安装它（两种方式，一种 "classical" 和第二种使用 fineuploader gem，这似乎是一样的）。

创建了包含此内容的咖啡文件。

$ ->
  uploader = new (qq.FineUploader)(
    debug: true
    element: document.getElementById('fine-uploader')
    request: endpoint: '/uploads')
    template: 'test-template'

这会创建一个 "upload a file" 按钮（这当然不起作用，因为在服务器站点上没有配置来处理它），但我希望这个按钮采用简单形式输入字段。

此外，模板不起作用，我不太明白为什么。

不幸的是，文档缺少 Rails 的帮助。

我愿意将此库更改为其他库，只要它包含我需要的功能即可：

暂停和恢复下载
文件分块（如果失败，用户不会被强制重新开始）
进度条（不重要）

Answer 1

我已经设法让它工作了，而且我对它的工作原理有一些了解，所以我将分享这些知识。但我想强烈指出，这是我自己想出来的，所以我提供的内容可能存在缺陷。运用你的知识和经验，如果你认为某件事可以做得更好，那你可能是对的。

首先，使用 npm 下载库。我为它找到了两个宝石，但不要使用它们。在我写这篇文章的时候，那些 gems 已经过时了，不会工作。 Github 链接：

github.com/mezis/fineuploader-rails
github.com/zakgrant/fine-uploader-rails

如果你碰巧下载了那些，你将不得不重新安装库。

之后，您将创建 javascript。我创建了一个名为 "fine-uploader.coffee" 的文件，并在其中放置了如下内容：

$ ->
  uploader = new (qq.FineUploader)(
    element: document.getElementById('fine-uploader')
    request:
      endpoint: '/upload'
      params:
        authenticity_token: $('#fine-uploader').data('authenticity-token')
    template: 'template-name'
    chunking:
      enabled: true
      mandatory: true
      success:
        endpoint: "/upload/finish"
)

我不打算描述什么是什么，因为所有这些都可以在文档中找到，相反我将专注于对我们来说重要的事情。在 "request" 中你有一个端点，对于这种情况，我们需要将它添加到我们的路由中，就像这样。

post 'upload', to: 'uploads#create'

然后，我们需要创建我们的控制器。如您所见，我已经创建了专门的控制器来处理上传，我建议您这样做。

在上传控制器中我们有这个动作：

def create
    file = params[:qqfile]

    #code that does whatever you need

    respond_to do |format|
       format.json {
          render json: { success: true }
       }
    end
end

在你的控制器中，你会有一些参数（你可以在文档中查看所有参数），但对你来说重要的是 qqfile。这将是 posted 的文件。你可以用它做任何你想做的事。我是用carrierwave来保存和处理它的，我想这不需要进一步的描述（因为你可以在carrierwave dosc中找到它，另外，你可能使用其他东西，比如refile）。

您还必须添加一个带令牌的参数，您可以在 javascript 文件的第 7 行中看到它。我建议阅读有关 CSRF 令牌的内容。

重要的是，如果您选择（像我一样）分块选项，这将不是整个文件，只是其中的一部分。您可以找到更多关于如何处理分离文件的教程，但您需要注意的是您将在参数中发送的 qquuid。此 id 标识正在上传的文件，您将需要它来确定上传部分属于哪个文件，因此您不会混淆两个文件。每个部分都是通过单独的 post 请求发送的，因此我建议将像 qquuid 这样的列添加到处理文件的模型中。例如：

Attachment.new(params[:qqfile], params[:qquuid])

保存所有文件后，您可以合并它们（查看 ruby 文件 class 了解操作方法）。

Attachment.where(qquuid: params[:qquuid]).combine_them_all

上面这行可以放在create action的末尾，条件是这是最后一部分（有总部分号和当前部分的索引号的参数，可以用来确定），或者在 "finish" 操作中，如果你这样做

chunking:
    success:
        endpoint: "/upload/finish"

您将必须创建路线（与上面所示的方式相同）和动作。此操作将在最后一部分发送后触发。如果文件太小而无法分开，则不会触发，除非您将 mandatory 设置为 "true".

最后一件事是 json 响应。这部分很简单，上传者希望您回复（json）您收到了文件并且一切顺利。如果它没有得到它，它会假设出了什么问题（您可以在上传者文档中阅读更多关于 expected json 的信息）。重要的是，如果失败，它将尝试再次发送失败的部分（如果 autoRetry 设置为 true）。

现在，对于视图 (haml)：

#fine-uploader{"data- authenticity-token" => form_authenticity_token}
%script#template-name
    Here goes the template

有关模板的更多信息，您可以在文档中阅读，但重要的是，不要为此使用 rails 形式（或简单形式）。有一种方法可以将表单与优秀的上传器连接起来，但我无法让它工作，而且我不需要使用该表单，但如果你需要它，你可以使用生成的令牌创建一个隐藏字段, 来识别它，并使用它代替 qquuid 来识别文件。您可以以相同的方式在参数部分提供它，您已经提供了 CSRF 令牌，并在上传控制器的 "create" 操作中使用它。

就是这样。我希望它会对某人有所帮助。

编辑：用户 Panczo posted

制作了一个示例应用程序

Fine Uploader Rails 表格

Fine Uploader with Rails form

ruby-on-rails

fine-uploader