JavaScript文件上传机制

Question

我需要让用户在当前网页上上传文件（主要是图片）。您认为最好的工具、库或机制是什么？我正在使用最新的jQuery和Spring webmvc（带有JSP），因此如果它们内部已经有机制，那就太理想了。

另外，拥有某种形式的进度条也会很棒。这是否意味着需要与服务器协调以读取进度（这时需要使用Spring）？还是JavaScript内部有这样的机制呢？

- at.

Answer 1

我经常使用uploadify：http://www.uploadify.com/

然而，它使用flash进行上传机制，因此如果用户已经通过身份验证，则可能会出现一些问题。

- kroehre

---

论坛中似乎有很多用户问题，而且对于需要Flash并不疯狂（虽然这不是一个决定性因素）。我还必须在文件上传时使用常规表单字段，但不确定使用Flash机制会有多棘手。 - at.

是的，它很容易实现但有限制。我一直在研究plupload（hristo的帖子），以及为我正在开发的项目创建简化的自定义实现的可能性。 - kroehre

Answer 2

你应该看看Plupload。

Plupload提供了一个跨浏览器的JavaScript文件上传API，处理多个文件上传、客户端进度条、类型过滤，甚至还有来自桌面的客户端图像调整和拖放。它通过为Flash、Silverlight、Google Gears、HTML5和Browserplus提供后端，并选择最可用的选项来实现所有这些功能。

真的很棒！这里是一些他们的演示链接...

http://www.plupload.com/example_jquery_ui.php

...以及jQuery UI队列小部件的截图（它有进度条！）：

希望这可以帮到你。
Hristo

- Hristo

---

这正是我正在寻找的东西。在某种意义上，它似乎是一个独立的上传文件机制。例如，我不能有一个带有图像描述和标签字段的表单。这实际上非常关键，所以我需要想出如何实现类似的功能。很棒的是我不需要涉及Spring，仍然可以获得进度条！我喜欢他们尝试提供浏览器能力的最佳体验。 - at.

@at...自从您接受了我的答案，我就认为您很满意 :) 为什么这“有点儿恰好”是您要找的东西？它是您要找的有点儿还是恰好？ - Hristo

我有其他表单字段，比如描述和标签，需要与上传一起发送，现在在查看更多演示和文档后，看起来我可以使用plupload的自定义机制来实现这一点。 - at.

你真的很有帮助，Hristo。我看到你也整理了我的问题 :) - at.

Answer 3

在客户端应该使用AJAX

http://www.webtoolkit.info/ajax-file-upload.html 这个教程涵盖了所有的客户端内容。

在服务器端，这个教程涵盖了大部分问题：

http://www.ioncannon.net/programming/975/spring-3-file-upload-example/

你可以使用jQuery或任何其他JS框架。

但最重要的是，你需要记住在客户端上你的标签应该有什么。

enctype='multipart/form-data'

属性。这意味着您的请求包含多部分数据。

- danny.lesnik

---

我知道如何在Spring中进行常规文件上传，但不知道ajax机制（我猜在上面的webtoolkit示例中只是一个常规上传）。但这并不能为我提供像其他答案所提供的进度条、文件大小和多选等好处。 - at.

Answer 4

Uploadify可以解决这个问题 >http://www.uploadify.com/所有例子都是php编写的，但是你应该能够将其转换为你所使用的平台。

- morgar

---

回应了另一个关于Uploadify的答案，相比之下我更喜欢Plupload。 - at.