Question

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

我有一个我认为可行的计划，但它失败了。这是我正在尝试的：

创建表单以进行上传，并将表单存储在S3本身上，与表单的“action”属性位于同一域中。
将客户重定向到此表单。现在他们的浏览器位于https://<bucket>.s3.amazonaws.com/something。
该页面包含隐藏的iframe。表单将其目标设置为iframe。
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文档，其中包含一个“message”节点。但是，.find('message')始终无法在XML文档中找到任何内容。

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

感谢您的任何建议！

Answer 1

这应该只是一个评论，但你可以发布响应XML代码吗？

编辑：为了缩小范围，我做了一个简单的测试并且工作得非常好：

<div id="foo">
    <error> 
        <code>AccessDenied</code>
        <message>Invalid according to Policy: Policy expired.</message> 
        <hostid> SZuQn5hTyf32j79AWUym1/si48oqjPifrx4goDVDLYYxc6cJVbbHroLJYcAM89+T</hostid> 
    </error> 
</div>

然后我在我的firebug上做了一些jQuery代码：

$("#foo").find("message").text()

也许你可以给alert($("#foo").html())并检查回复..

Answer 2

有许多jQuery插件可以有效地实现您要执行的操作。谷歌搜索“jQuery ajax-upload”，您可以直接使用其中一个控件来捕获帖子的结果或检查他们的代码并自行推送。

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

Answer 3

我认为你正试图解决错误的问题。问题不是详细的问题，有iframe等，但你想要更好地控制上传。将文件上传到您的服务器，然后向Amazon服务器提交请求，您就可以完全控制正在发生的事情。

当然，这显然更为复杂，但那是控制的代价。

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

3 个答案: