Question

我正在尝试使用 Uploadifive （Uploadify的HTML5版本）来使用Amazon S3。我们已经安装了Uploadify，但是我们的访问者在没有闪存的情况下使用Safari，所以我们也需要上传。

我正在寻找一个POST，但问题是上传的OPTIONS请求上传文件发送的内容是“Access-Control-Allow-Origin不允许使用403 Origin。”

亚马逊上的CORS规则设置为允许*来源，因此我认为亚马逊没有理由拒绝该请求（并注意它接受来自Flash的请求，但我不知道Flash是否发送了OPTIONS请求在POST之前）。如果我在亚马逊的设置中没有犯过一些大的错误我认为这与Uploadifive没有设置为跨源请求有关，但我找不到关于如何检查/执行此操作或甚至如何更改请求中发送的标头。

有没有人尝试过将Uploadifive与Amazon S3一起使用，你是如何解决这个问题的？

我的S3 CORS设置：

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <MaxAgeSeconds>3000</MaxAgeSeconds>
    <AllowedHeader>Authorization</AllowedHeader>
</CORSRule>
<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>POST</AllowedMethod>
</CORSRule>

编辑：在使用--disable-web-security标志测试Chrome后，我停止了获取403：s，因此看起来它确实是Uploadifive没有正确设置跨域标头。现在的问题是，如何修改Uploadifive的跨域设置？

Answer 1

胜利！

在我的头撞墙几个小时后，我发现了两个错误。

1）要通过 AllowedHeader 标记在CORS设置中指定要发送到Amazon 的任何标题（超出最基本的标题）必须。所以我将亚马逊上设置的POST部分更改为：

<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>POST</AllowedMethod>
    <AllowedHeader>*</AllowedHeader>
</CORSRule>

2）Uploadifive首先在formData中添加“file”字段，Amazon要求它是最后一个字段。所以我修改了Uploadifive js以最后添加文件字段。在1.1.1中，这是第393行，这是改变：

在：

// Add the form data
formData.append(settings.fileObjName, file);

// Add the rest of the formData
for (var i in settings.formData) {
    formData.append(i, settings.formData[i]);
}

后：

// Add the rest of the formData
for (var i in settings.formData) {
   formData.append(i, settings.formData[i]);
}

// Add the form data
 formData.append(settings.fileObjName, file);

这解决了我的问题。可能仍有一些工作要做，以使Uploadify了解响应，但上传本身现在可以正常工作并返回201 Created。

上传和亚马逊s3 - Access-Control-Allow-Origin不允许使用Origin

1 个答案: