django - 带有 CORS 文件上传的 Amazon S3； s3upload.js 示例

我正在尝试设置一个 Django 应用程序以允许 CORS 上传到 Amazon S3 存储桶 - 运气为 0。我一直在 Firefox 和 Chrome 中收到 403 Forbidden 消息，无论是在本地主机上还是从 Web 服务器上。我已验证我的签名计算正确(如下所述)，并且我的存储桶策略是允许 origin *、允许 PUT/POST/GET 方法并允许 headers *。我的访问 key / secret key 对是正确的，允许我通过 Cyberduck 之类的软件访问存储桶。我还能检查什么，或者如何进一步调试？我觉得我已经探索了所有可能的途径

我试图遵循这个 demo ，只是修改编码以匹配这个 SO question 。这允许我的签名匹配 this Amazon S3 test file 。我的签名生成代码在这里:

s3_bucket_name = settings.S3_BUCKET_NAME
s3_access_key = settings.S3_ACCESS_KEY
s3_secret_key = settings.S3_SECRET_KEY

object_name = request.GET.get('s3_object_name')
mime_type = request.GET.get('s3_object_type')

expires = int(time.time()+300)
amz_headers = "x-amz-acl:public-read"

put_request = "PUT\n\n%s\n%d\n%s\n/%s/%s" % (mime_type, expires, amz_headers, s3_bucket_name, object_name)

hashed = hmac.new(s3_secret_key, put_request, sha1)
signature = binascii.b2a_base64(hashed.digest())[:-1]
signature = urllib.quote_plus(signature.strip())

url = 'https://%s.s3.amazonaws.com/%s' % (s3_bucket_name, object_name)

signed_request = '%s?AWSAccessKeyId=%s&Expires=%d&Signature=%s' % (url, s3_access_key, expires, signature)

pdb.set_trace()

return HttpResponse(json.dumps({
    'signed_request': signed_request,
     'url': url
  }), mimetype='application/json')

我的上传功能:

function s3_upload(filename) {
filename = filename.split('\\').pop();
var s3upload = new S3Upload({
    file_dom_selector: '#video_file',
    s3_sign_put_url: 'signS3put/',
    s3_object_name: filename,
    onProgress: function(percent, message, publicUrl, file) {
      console.log('Upload progress: ', percent, message);
    },
    onFinishS3Put: function(public_url, file) {
      console.log('Upload finished: ', public_url);
    },
    onError: function(status, file) {
      console.log('Upload error: ', status);
    }
});
}

我的文件输入按钮:

video_form.append('<input class="input-block-level"' +
            'autocomplete=off id="video_file" name="video_file"' +
            'type=file required="required" onchange="' +
                    'var filename = $(this).val();' +
                    's3_upload(filename);" />');

这发生在我的本地开发服务器和远程服务器上，所以这不是 SO post 关于 Chrome 阻止本地服务器 CORS 调用的说法。

感谢您的提示!

最佳答案

所以我解决了这个问题，希望这会帮助其他人(不过似乎没有其他人有这个问题，所以也许我的设置不同)。我的问题原来是与 s3upload.js 库有关。两件事情:

我想进行身份验证读取，在示例中 sign_s3 View 设置为公共(public)读取。仅在 View 中更改它没有帮助--x-amz-acl:public-read 也在 s3upload.js 中的函数 uploadToS3(第 107 行)中进行了硬编码。所以你必须改变它以匹配你的 View ，否则我认为签名编码永远不会匹配 CORS 请求 header 。

特殊字符 =、+ 和/害死我了。在这个 Amazon S3 article 的底部提到了它们作为需要注意的事情，所以我确保散列算法取代了它们。问题是，即使我的散列算法在我看来正确地用转义字符替换了这三个字符，s3upload 还是将它们解码并重新编码为 =、+ 和/。我在 executeOnSignedUrl 中更改了一行(第 71 行):

  return callback(result.signed_request, result.url);
  //return callback(decodeURIComponent(result.signed_request), result.url);

现在它神奇地起作用了!请注意，这与 this SO solution 非常相似，只是特定于 s3upload.js 库。

作为旁注——S3 似乎也不喜欢键名中的空格(我确实在亚马逊文档的某处读过这个，我认为)，这是我遇到的一个单独的问题......

关于django - 带有 CORS 文件上传的 Amazon S3； s3upload.js 示例，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/18219679/