Amazon S3 简单的 Javascript 客户端文件上传问题

Amazon S3 simple Javascript client-side file-upload issue

本文关键字:文件 问题 客户端 Javascript S3 简单 Amazon      更新时间:2023-09-26

我只是没有让这个aws s3工作。现在尝试了几件事,包括角度的示例(我不想使用 fineUploader!)以及每次我都遇到相同的错误。现在我有一个非常可靠的示例,说明需要做什么才能得到我的错误:

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<script src="http://crypto-js.googlecode.com/svn/tags/3.1.2/build/rollups/hmac-sha256.js">    </script>
<script src="http://crypto-js.googlecode.com/svn/tags/3.1.2/build/components/enc-base64-min.js"></script>
<script>
    var POLICY_JSON = { "expiration": "2014-12-20T12:00:00.000Z",
        "conditions": [
            {"bucket": "<AWS_BUCKET_NAME>"},
            ["starts-with", "$key", "russ"],
            {"acl": "public-read"},
            {"success_action_redirect": "http://localhost:3000/successful_upload.html"},
            ["starts-with", "$Content-Type", "image/"]
        ]};
    var policyBase64 = btoa((JSON.stringify(POLICY_JSON)));
    console.log('<POLICY> -->');
    console.log(policyBase64);
    var hash = CryptoJS.HmacSHA256(policyBase64, "<AWS_SECRET_KEY>");
    var base64 = CryptoJS.enc.Base64.stringify(hash);
    console.log('<SIGNATURE> -->');
    console.log(base64);
</script>

<form action="http://bucket.s3.amazonaws.com" method="post" enctype="multipart/form-data">
    <input type="hidden" name="acl" value="public-read" />
    <input type="hidden" name="success_action_redirect" value="http://localhost:3000/successful_upload.html" />
    <input type="hidden" name="AWSAccessKeyId" value="<AWS_ACCESS_KEY>" />
    <input type="hidden" name="Policy" value="<POLICY>" />
    <input type="hidden" name="Signature" value="<SIGNATURE>" />

    Key to upload: <input type="input" name="key" value="test.jpg" /><br />
    Content-Type: <input type="input" name="Content-Type" value="image/jpeg" /><br />
    File: <input type="file" name="file" /> <br />
    <input type="submit" name="submit" value="Upload to Amazon S3" />
</form>
</body>
</html>

将所有内容复制到新的.html文件中并打开一次,若要将值放入控制台,请使用出现的值填写表单.html然后再次打开索引。我最大的问题是每次尝试将某些内容上传到我们的存储桶时都会得到答案。

<Error>
    <Code>InvalidRequest</Code>
    <Message>
        The authorization mechanism you have provided is not supported. Please use AWS4-HMAC-SHA256.
    </Message>
    <RequestId><MYREQUESTID></RequestId>
    <HostId>
        <MYHOSTID>
    </HostId>
</Error>

有什么建议吗?我现在正在为此工作 2 天,搜索和阅读亚马逊文档。它与我需要做的签名有关(aws 使用的新签名似乎被命名为"v4"),并且用于存储桶,因为它位于德国法兰克福。但我只是不知道如何增强我的请求以满足他们的需求。

您正在构建 V2 策略文档,并使用 HMAC 与您的 AWS Secret 对其进行签名,这仅适用于 V2。

使用 V4,您必须构造一个用于对请求进行签名的"签名密钥",并在策略中包含用于构造该密钥作为x-amz-credential的信息,以及其他一些更改。

http://docs.aws.amazon.com/AmazonS3/latest/API/sigv4-post-example.html

生成签名的实际方法也不同。

http://docs.aws.amazon.com/AmazonS3/latest/API/sig-v4-authenticating-requests.html

您可能应该从这里开始...

http://docs.aws.amazon.com/AmazonS3/latest/API/sigv4-UsingHTTPPOST.html

正如您现在可能已经发现的那样,法兰克福和 2014 年或之后部署的任何其他 S3 区域都不支持签名版本 2。 所有区域都支持签名版本 4。

虽然Michael的回答是正确的,但我还想补充一点,我们有一个JavaScript SDK,允许您直接从浏览器调用AWS API,使用最少的JavaScript代码。SDK 负责处理低级细节 - 我们称之为无差别的繁重工作 - 例如 HTTP 连接、重试和签名。更多详情请见 http://aws.amazon.com/sdk-for-browser/

另外,不要将密钥存储在客户端的 JavaScript 代码中(在签名生成代码中)。 有权访问您的访问密钥(在表单中可见)和私有密钥(在您的 JavaScript 代码中)的任何人都可以访问您的账户,并具有与此密钥对的 IAM 策略关联的权限。

如果您考虑使用 S3 上传表单,最佳实践是在服务器端生成表单。 通过这样做,您的密钥将保留在您的服务器上,而不会在客户端公开。

好的,

所以答案不是那么简单,但我使用它作为现实世界的编程示例来解决> https://github.com/emil10001/AWS-NodeJS-AngularJS-Demos 它。

这就是我最终得到的服务器代码:

        var urlPair = {};
        var key = crypto.createHash('sha1')
            .update(new Date().getTime().toString() + Math.random().toString())
            .digest('base64').toString();
        urlPair['s3Key'] = key;
        var putParams = {
            Bucket: 'bucket',
            Key: key,
            ACL: 'public-read',
            ContentType: 'application/octet-stream'
        };
        s3.getSignedUrl('putObject', putParams, function (err, url) {
            if (!!err) {
                console.log(err);
                return;
            }
            urlPair['s3PutUrl'] = url;
            urlPair['s3GetUrl'] = 'https://bucket.s3.amazonaws.com/' + qs.escape(key);
            res.json(urlPair);
            res.end();
        });

s3PutUrl 和 s3GetUrl 都返回有效的语句以允许您上传文件。但这只是其中的一部分。按照 emil10001 通过他的例子,你最终将拥有工作代码和工作环境!