reactjs - 将图像上传到 AWS S3 存储桶 ReactJS 时 POST 403 禁止 CORS 响应

Question

您好，我正在尝试使用名为 react-s3 的 NPM 包将图像从我的 React 应用程序上传到 AWS S3。我正在使用 AWS Educate 账户并正确设置了访问 key 和 key 。在我选择图像和控制台记录输出后，它给我一个 403 forbidden 错误，如下所示。

发布https://shopkartimages.s3.amazonaws.com/ 403(禁止)

Response {type: "cors", 
url: "https://shopkartimages.s3.amazonaws.com/", 
redirected: false, 
status: 403, ok: 
false, …}
body: (...)
bodyUsed: false
headers: Headers
__proto__: Headers
ok: false
redirected: false
status: 403
statusText: "Forbidden"
type: "cors"
url: "https://shopkartimages.s3.amazonaws.com/"
__proto__: Response

我的桶策略如下:

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "S3Permissions",
            "Effect": "Allow",
            "Principal": "*",
            "Action": [
                "s3:Get*",
                "s3:List*"
            ],
            "Resource": "arn:aws:s3:::shopkartimages/*"
        }
    ]
}

我在S3中的CORS配置如下:

[
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "PUT",
            "POST",
            "DELETE"
        ],
        "AllowedOrigins": [
            "*"
        ],
        "ExposeHeaders": [
            "x-amz-server-side-encryption",
            "x-amz-request-id",
            "x-amz-id-2"
        ],
        "MaxAgeSeconds": 3000
    }
]

Answer 1

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "S3Permissions",
            "Effect": "Allow",
            "Principal": "*",
            "Action": [
                "s3:Get*",
                "s3:List*"
            ],
            "Resource": "arn:aws:s3:::shopkartimages/*"
        }
    ]
}

您的存储桶策略仅允许Get 和List 操作。上传文件是一个 PUT 操作。