Question

我在html中有这个网页

<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script src="https://cdnjs.cloudflare.com/ajax/libs/aws-sdk/2.171.0/aws-sdk.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <script>
            AWS.config.update({accessKeyId: '', secretAccessKey: ''});
            var s3BucketName = '';
            var s3RegionName = 'US East (Ohio)';

            function uploadFile() {
                var s3 = new AWS.S3({params: {Bucket: s3BucketName, Region: s3RegionName}});
                var file = document.getElementById('fileToUpload').files[0];
                if (file) {
                    s3.putObject({Key: file.name, ContentType: file.type, Body: file, ACL: "public-read"},
                    function(err, data) {
                        if (data !== null) {
                            alert("Successful upload");
                        }
                        else {
                            alert("Upload failed");
                        }
                    });
                }
            }
        </script>
    </head>
    <body>
        <input type="file" id="fileToUpload"/>
        <button onclick="uploadFile()">Upload to S3</button>
    </body>
</html>

这是cors规则

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>http://*</AllowedOrigin>
    <AllowedOrigin>https://*</AllowedOrigin>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>POST</AllowedMethod>
    <MaxAgeSeconds>3000</MaxAgeSeconds>
    <AllowedHeader>*</AllowedHeader>
    <ExposeHeader>Content-Range</ExposeHeader>
    <ExposeHeader>Content-Encoding</ExposeHeader>
    <ExposeHeader>Content-Length</ExposeHeader>
    <ExposeHeader>Access-Control-Allow-Origin</ExposeHeader>
</CORSRule>
</CORSConfiguration>

我已将网页保存为cors.html并打开并尝试上传。我已删除使用的凭据。

即使我更新s3上的cors配置

，我仍然会收到此错误

阻止跨源请求：同源策略禁止读取远程资源位于https：//*.s3.amazonaws.com/cors.html。（原因：缺少CORS标题“Access-Control-Allow-Origin”。

为什么即使我更新了我的cors规则以允许从几乎任何地方接收上传，错误仍然会重新出现？。

Answer 1

这条规则终于有效了

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
        <AllowedMethod>POST</AllowedMethod>
        <AllowedMethod>PUT</AllowedMethod>
        <AllowedHeader>*</AllowedHeader>
        <ExposeHeader>Accept-Ranges</ExposeHeader>
        <ExposeHeader>Content-Range</ExposeHeader>
        <ExposeHeader>Content-Encoding</ExposeHeader>
        <ExposeHeader>Content-Length</ExposeHeader>
        <ExposeHeader>Access-Control-Allow-Origin</ExposeHeader>
    </CORSRule>
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
        <AllowedMethod>POST</AllowedMethod>
        <AllowedMethod>PUT</AllowedMethod>
        <AllowedHeader>*</AllowedHeader>
        <ExposeHeader>Accept-Ranges</ExposeHeader>
        <ExposeHeader>Content-Range</ExposeHeader>
        <ExposeHeader>Content-Encoding</ExposeHeader>
        <ExposeHeader>Content-Length</ExposeHeader>
        <ExposeHeader>Access-Control-Allow-Origin</ExposeHeader>
    </CORSRule>
</CORSConfiguration>

上传到亚马逊s3失败

1 个答案: