如何进行文件上传并将结果返回到同一页面？答案

【问题标题】：How can I do a File Upload and return results to the same page?如何进行文件上传并将结果返回到同一页面？
【发布时间】：2014-03-11 18:47:23
【问题描述】：

我需要上传文件并将结果返回到同一页面。 <form> 也有几个将在 POST 中发送的数据字段。

由于浏览器支持有限，我不能使用 HTML 5，不幸的是，我见过的 AJAX 文件上传解决方案都使用 HTML 5。我可以用 Javascript 进行 POST，但我还没有看到像这样的文件上传这个。

我的服务器是用 Java 编写的，但这没关系。

有没有办法让这种POST的结果返回到同一页面？

【问题讨论】：

标签： javascript post file-upload

【解决方案1】：

我最终使用了jQuery Form Plugin。它支持使用此选项在标头中发送基本身份验证凭据：

headers  : { Authorization: basicAuthCredentials}

我也需要这样做。

【讨论】：

【解决方案2】：

在 Flash、Silverlight 和 HTML5 文件 API 之外，普遍接受的方法是将您的 <form> 发布到页面上不可见的 <iframe>。

<iframe> 位置是在后台上传文件的页面或文件处理程序。然后，您将在主页上运行一个 javascript 函数，该函数会定期轮询您的服务器并检查下载是否已完成。

当您将文件上传到<iframe> 时，您需要某种方式来识别客户端和服务器都知道的上传。一种方法是在客户端上生成一个 GUID，并将其与文件和其他数据字段一起发布。服务器应在接收文件数据之前保留该 GUID，并通过将进度和 GUID 链接在一起来跟踪上传进度。由于生成的客户端已经知道 GUID，它可以向服务器发送请求，通过发送它生成的内容来获取上传进度。

【讨论】：

【解决方案3】：

我建议您看看 jQuery 表单插件如何进行“旧版”文件上传。基本上它使用 iframe 在后台提交表单。 http://malsup.com/jquery/form/#file-upload

【讨论】：

这是AJAX文件上传，存在浏览器兼容性问题。在 IE8 上，即使文件上传字词，我也会收到一个报告 405 错误的弹出窗口。
嗯，这看起来很奇怪（但 IE 也是如此）。看看stackoverflow.com/questions/5825432。它没有标记为已解决，但它可能为您提供足够的信息来确定解决方案（即使它只是为 GET 添加一个立即返回成功的处理程序）。