Question

我使用ReactS3Uploader将文件从browswer上传到s3。我的CORS规则如下：

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

如果我将<AllowedHeader>Authorization</AllowedHeader>更改为<AllowedHeader>*</AllowedHeader>，则每个人都可以正常工作。但是当我使用<AllowedHeader>Authorization</AllowedHeader>时出现错误：

A wildcard '*' cannot be used in the 'Access-Control-Allow-Origin' header when the credentials flag is true. Origin 'http://localhost' is therefore not allowed access. The credentials mode of an XMLHttpRequest is controlled by the withCredentials attribute.

以下是我的ReactS3Uploader：

<ReactS3Uploader
              signingUrl="/s3/sign"
              signingUrlMethod="GET"
              //accept="image/*"
              s3path="/test"
              //signingUrlHeaders={{ additional: headers }}
              //signingUrlQueryParams={{ additional: query-params }}
              //signingUrlWithCredentials={ true }      // in case when need to pass authentication credentials via CORS
              uploadRequestHeaders={{ 'x-amz-acl': 'public-read' }}  // this is the default
              contentDisposition="auto"
              scrubFilename={(filename) => filename.replace(/[^\w\d_\-.]+/ig, '')}
              server="http://localhost:3001" />

以下是签名的服务器端代码：

app.use('/s3', require('react-s3-uploader/s3router')({
    bucket: "bucktmodel",
    region: 'us-east-1', //optional
    signatureVersion: 'v2', //optional (use for some amazon regions: frankfurt and others)
    //headers: {'Access-Control-Allow-Origin': '*'}, // optional
    ACL: 'private', // this is default
    uniquePrefix: true // (4.0.2 and above) default is true, setting the attribute to false preserves the original filename in S3
}));

Answer 1

这是因为：

1）我没有权限上传文件，所以我需要添加策略以启用上传到此存储桶;

2）我有多个空格行结束我的CORS设置

使用<allowedheader>授权</allowedheader> CORS规则将文件上传到存储桶

1 个答案: