Question

我正在尝试从前端应用程序中的HTTP请求将文件上传到AWS S3亚马逊，但在浏览器中收到以下错误：响应{类型：“ cors”，网址：“ https://my-bucket.s3-sa-east-1.amazonaws.com/08…nedHeaders = host％3Bx-amz-acl＆x-amz-acl = public-read”，重定向：false，状态：403，ok：false，…} 在“网络”标签中，它显示：“访问被拒绝”错误

因此，我认为我的存储桶政策存在问题：这是我在存储桶策略中配置的：

{
"Version": "2012-10-17",
"Id": "Policy1544564620007",
"Statement": [
    {
        "Sid": "Stmt1544564832145",
        "Effect": "Allow",
        "Principal": {
            "AWS": [
                "arn:aws:iam::<account-number>:root"
            ]
        },
        "Action": "s3:*",
        "Resource": "arn:aws:s3:::my-bucket"
    }
]

}

此外，存储桶的CORS配置如下：

<CORSRule>
   <AllowedOrigin>http://localhost</AllowedOrigin>
   <AllowedOrigin>http://*</AllowedOrigin>
   <AllowedOrigin>*</AllowedOrigin>
   <AllowedMethod>GET</AllowedMethod>
   <AllowedMethod>POST</AllowedMethod>
   <AllowedMethod>PUT</AllowedMethod>
   <AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>

我在后端服务器（使用express的node.js）中使用ASW SDK来获取我的签名URL：

     var AWS = require('aws-sdk');
    .....
    app.post('/requestUploadURL', function(request, response) {
     var s3 = new AWS.S3(
        {accessKeyId: "<my AWS Access Key Id here>",
         secretAccessKey: "<my AWS Secret Key here>",
         endpoint: 's3-sa-east-1.amazonaws.com',
         signatureVersion: 'v4',
         region: 'sa-east-1'} 
       );

    var params = request.body;

    var s3Params = {
      Bucket: 'my-bucket', 
      Key:  params.name, //file name
      ContentType: params.type, // file type
      ACL: 'public-read'
    };

    var uploadURL = s3.getSignedUrl('putObject', s3Params);

    response.status(200).json({
         uploadURL: uploadURL
      })
 }

在我的前端应用程序（vue.js）中，我有以下代码使用从后端获取的预签名URL上传文件：

  ...
 submitFile(e){
   e.preventDefault();
   var file = this.$refs.file.files[0];
   var reader = new FileReader();
   reader.addEventListener('loadend', function(e) {
     axios.post("http://localhost:3000/requestUploadURL", {
          name: file.name,
          type: file.type
      }) // end Api().post
     .then(response => {
        console.log('Upload file to AWS ')
        console.log(response)
        console.log(reader)
        var url = response.data.uploadURL
        fetch(url, {
           method: 'PUT',
           body: new Blob([reader.result], {type: file.type})
        })
        .then(res => {
            console.log('Uploaded successfull ')
            console.log(res)
          }).catch((error) => {
            console.log('Upload error: ')
            console.log(error)
          })
      }) // end first .then(response =>
   }) // end reader.addEventListener

    reader.readAsArrayBuffer(file);
    return false
 } // end submit

我必须使用--args --disable-web-security打开Chorme，因为由于我在本地运行前端应用程序（localhost：8081）和后端（localhost：3000）。否则，由于CORS问题，Chrome不允许发送HTTP请求。

因此，请考虑到我在本地运行，并且我在后端使用我的根AWS账户KEY和Secret KEY来设置后端Express服务器（用于获取签名的URL）。我没有使用USER（IAM）

您知道我的问题是什么吗？我设置了错误的存储桶策略？请指教。

谢谢！

AWS S3存储桶-尝试上传文件时访问被拒绝

0 个答案: