通过POST上传S3浏览器:无法正常处理错误

Question

我正在编写一个应用程序,我希望客户能够直接从浏览器上传到Amazon S3.我可以把这项工作做得很好.但是当出现错误时,我希望比在客户屏幕上展开XML文档更优雅地处理它们.

我有一个我认为可行的方案,但它失败了.这是我正在尝试的:

1. 创建表单以进行上载,并将表单存储在S3本身上,与表单的"action"属性位于同一域中.
2. 将客户重定向到此表单.现在他们的浏览器位于https:// <bucket> .s3.amazonaws.com/something.
3. 该页面包含隐藏的iframe.表单将其目标设置为iframe.
4. load事件处理程序查看iframe的内容,并对其进行操作.

所以,像这样:

<iframe id="foo" name="foo" style="display: none" />
<form target="foo" action="https://<bucket>.s3.amazonaws.com/">
    <input type="hidden" name="..." value="..." />
    <input type="file" name="file" />
</form>

用这个javascript(使用jquery):

function handler() {
    var message = $("#foo").contents().find('message').text();
    alert(message);
}
$("#foo").load(handler);

使用firebug,我可以看到iframe包含一个XML文档,其中包含一个"消息"节点.但是,.find('message')始终无法在XML文档中找到任何内容.

请注意,表单的操作与文档本身具有相同的域,端口和方案.所以,我认为我不应该违反同源政策.对？但它每次都失败了.这是使用Firefox和谷歌Chrome浏览器.

谢谢你的建议!

Answer 1

有许多 jQuery 插件可以有效地实现您想要做的事情。在 Google 上搜索“jQuery ajax-upload”，您可以直接使用这些控件之一来捕获帖子的结果或检查它们的代码并推出您自己的代码。

如果您要上传大文件，您可能还需要研究一些基于 Flash 的上传程序。纯形式的上传方法没有任何实现上传进度的方法，至少在Flash确实提供的新文件功能在浏览器中广泛传播之前是这样。http://github.com/slaskis/s3upload#readme是一个优秀的基于 Flash 的文件上传器，专为 S3 设计，并为您提供 JavaScript 中的回调函数来处理错误、进度等。