问题标签 [jquery-file-upload]

我知道有几种传输方式，包括 iFrame 传输方式，而且有些浏览器不支持进度更新。

我想知道的是，在发出请求之前，是否有办法检测 jquery-file-upload 正在使用哪种传输方式，或者是否支持上传进度。

现在我只需要等待第一个进度回调并在那个事件中换掉我的自定义进度条样式，如果我知道我会收到进度事件，我宁愿能够有一个空的进度条开始。

插件链接，http://blueimp.github.io/jQuery-File-Upload/

这里隐藏了一些相关的小问题，但它们确实指向一个大而多毛的最佳实践问题。这是一个很难实现的功能，因为它应该一次做一些棘手的事情......

• 拖放式多文件上传器（通过 Javascript）
• 多页表单（第一页：上传文件并将文件与现有文档模型关联；第二页：更新和保存文件/文档对象和元数据到数据库）

...而且我还没有在任何地方找到预先存在的代码示例或实现。（根据一个人的方法，它可以扫除桌面或自动回答所有相关/嵌入式/后续问题。）底线，这篇文章的目的是回答这个问题：什么是最优雅的方法，可以最大限度地减少介入问题/问题？

我在 Django 中使用这个拖放式 JQuery 文件上传器的实现来上传文件......

https://github.com/miki725/Django-jQuery-File-Uploader-Integration-demo

当然，我上面链接的解决方案将文件保存在文件系统上，但是在每个上传会话中分批保存，通过为每批文件创建一个目录，然后为每个目录分配一个 UUID。文件系统上每个唯一命名的目录都包含在该特定上传会话期间上传的文件。这意味着任何类型的数据库存储方法都必须首先梳理并迭代此解决方案为每个上传会话创建的文件系统目录中的所有文件。

注意：上面链接的 JQuery 解决方案不使用 app 目录中的表单（在 forms.py 中）。表单被硬编码到模板中，这已经有点令人沮丧了......因为现在我还必须找到一种很好的方法来将每批中的每个上述文件绑定到一个表单。

我认为最简单的——尽管可能是性能最差的解决方案——是为两个表单创建两个视图……将每个文件保存到第一页视图中的数据库中，然后在第二页上更新数据库。这是我目前正在滚动的方向：

在模板中...

在 VIEWS.PY...

# POST（在上传处理程序中；由上传操作触发的请求）

# GET（在同一个上传处理程序中）

第一个页面的这个视图利用了 JQuery 上传器，它非常适合每个会话的多文件上传，并且可以完成它应该做的事情。然而，正如上面所暗示的，作为上传处理程序的视图只是需要成为两页表单的第一页。在第二页，最终用户随后需要检索每个上传的文件，将附加数据附加到他们刚刚在第一页上传的文件，然后重新保存到数据库中。

我试图通过各种解决方案将这项工作作为两部分表单工作，包括表单向导和/或基于通用类的视图......以下示例主要通过会话实现数据持久性。这些解决方案很快就会变得相当棘手。

总之，我需要...

• 以唯一标识的批次上传多个文件（通过拖放）
• 梳理并迭代每批上传的文件
• 将批处理中的每个文件绑定到一个表单并将其与现有文档模型相关联
• 一次提交/保存所有这些文件到数据库
• 在潜在新表单的下一页/模板上检索这些文件中的每一个
• 更新每个文件的元数据
• 一次重新提交/保存所有这些文件到数据库

所以......您可以通过涉及以下相关问题来了解上述所有内容如何增加简单文件上传的复杂性，并增加提供该功能的复杂性：

forms.py：如何最好地将每个文件绑定到一个表单

models.py：如何将每个文件与预先存在的文档模型相关联

views.py如何按照 Postgres 中预先存在的文档模型在第一页保存每个文件；更新并保存第二页中的每个文档

...而且，我想在没有表单向导和基于类的视图的情况下完成所有这些工作。（尤其是对于这个用例，CBV 让我有点难以理解。）换句话说：我正在寻找可能导致最防弹且易于阅读/理解的解决方案的建议。如果它导致对数据库的多次点击，那对我来说很好。（如果将文件保存到数据库似乎是反最佳做法，请参阅另一篇文章：Storing file content in DB

我是否可以为两个表单创建一个单独的视图，并将标准上传表单子类化，就像这样......

在forms.py...

...然后重构上面的早期上传处理程序，例如...

在views.py 中，将以下内容替换为当前的上传处理程序...

...？

这里：https ://github.com/blueimp/jQuery-File-Upload/wiki/Frequently-Asked-Questions

我读到这个：如果你定义了 url（可能还有 paramName）选项，你可以在任何元素上调用插件——不需要表单或文件输入字段——并且拖放功能仍然有效。

我试过这段代码：

JS

HTML

jsfiddle：http: //jsfiddle.net/JellyBelly/hHZUq/

如果我单击按钮不打开窗口浏览文件。我哪里错了？

如果我将输入类型更改为文件工作。

谢谢

我收到此错误

尝试显示文件的 content_type（例如 image/jpg）时。我正在使用 Carrierwave + Jquery File（两者都经过大量修改以按照我想要的方式协同工作）+ Amazon s3（单击此查看我在做什么）。它以前只使用carrierwave和amazon s3，但是当我添加jquery文件上传和直接s3时，它不再工作了。

有人可以帮我吗？这就是我正在做的事情：

提前感谢您，如果您需要更多代码/信息，请告诉我

更多信息：我正在使用storage :fog. 在我的carrierwave上传器中，我包含了

我正在使用jquery-fileupload-railsGem 在我的应用程序中上传图像。这是代码：

在 .js 文件中：

一切正常，但图像上传后，进度条不会删除。上传后如何删除栏？

I've got the plug in working unless I change the window.location url as suggested in the commented code - and as I would prefer to do.

Changing either one or both blueimp.github.com or blueimp.github.io to the desired domain lets the progress bar run and suggests success, but nothing ever uploads.

I'm changing them to a valid url of the site and server that's running it using blueimp, yet it fails.

Starting with this:

and changing to this:

What am I doing wrong here?

Thanks in advance for any help.

我下载了blueimp Jquery-File-Upload插件，除了将其配置为使用我的服务器（在 js/main.js 中）并更改上传目录的权限之外，它是默认设置。

当我选择一个文件并单击 chrome 中的上传时，它会说：

在Firefox中它说：

我检查了在我的服务器和演示服务器上使用它之间的区别，在我的服务器上的 firebug POST 返回是整个 index.html：

但在演示服务器上它返回 JSON 数据：

这是我更改的 js/main.js 的修改部分：

除此之外，我所做的唯一其他更改是在 index.html 中让表单操作指向我的脚本。apache error_log 中没有错误。

我确定我错过了一些东西，但我似乎找不到它。

附加信息：PHP 版本 5.3.20 / Apache/2.2.22 (Fedora)

如果有任何其他有用的相关代码，请告诉我，我会更新这篇文章。任何帮助，将不胜感激。

鉴于以下演示：

jQuery File Upload Basic Plus 演示

根据演示，我在一个项目中工作，但我想删除每个图像上的“上传”按钮，并在顶部添加一个“全部上传”按钮。对于我的一生，我无法弄清楚如何去做，而且文档很薄......

我试图创建一个文件上传对象的句柄，例如var fileUpload = $('#fileupload').fileupload({并调用类似 fileUpload.send(); 但我只是得到“对象不包含方法'发送'”

我正在编写一些测试，试图让 blueimp jquery-fileupload 插件与 angularjs 一起工作。

这是我写的，尽量保持简单：

[控制器.js]

[html]

您还可以在此处查看正在运行的实例。

问题是，fileupload 插件返回的每个数据对象似乎都告诉我一切都很好，但实际上没有文件上传到服务器上（文件应该在这里上传）。

这可能是由我的服务器上的一些配置问题引起的，但我完全不知道应该朝哪个方向搜索。我在服务器端使用 blueimp 本机 uploadHandler.php

我已经构建了一个将视频文件发送到服务器的表单。

我的客户现在想要一个更好的 UI 的进度条。

是否可以放入可以使用当前表单而无需更改后端的 JS 脚本，或者我是否必须添加一些额外的路由/方法才能使其工作？

这是我尝试过的。

放入https://github.com/blueimp/jQuery-File-Upload插件。这看起来不错，但我无法将表单的提交按钮绑定到插件，因此表单只是“正常”提交并且插件没有运行（尽管插件正在初始化正常）。

我认为插件想自己发送文件，但我需要提交整个表单。

提前致谢。