Question

我在Django应用程序中实现了AWS-S3服务的Fine-Uploader。我遵循了基于Django的应用程序的官方documentation的一般说明。

这是我的 settings.py ：

AWS_ACCESS_KEY_ID = 'my_ACCESS_KEY_ID'
AWS_SECRET_ACCESS_KEY = 'my_SECRET_ACCESS_KEY'
AWS_STORAGE_BUCKET_NAME = 'my_BUCKET_NAME'
AWS_S3_CUSTOM_DOMAIN = '%s.s3.amazonaws.com' % AWS_STORAGE_BUCKET_NAME

AWS_S3_OBJECT_PARAMETERS = {
    'CacheControl': 'max-age=86400',
}

S3DIRECT_REGION = 'us-west-2'

AWS_LOCATION = 'static'

STATIC_URL = 'https://%s/%s/' % (AWS_S3_CUSTOM_DOMAIN, AWS_LOCATION)

STATICFILES_STORAGE = 'storages.backends.s3boto3.S3Boto3Storage'

AWS_MAX_SIZE = 15000000

这是我的 javascript ：

  $('#fine-uploader-s3').fineUploaderS3({
            template: 'qq-template-s3',
            request: {
                endpoint: "https://s3.console.aws.amazon.com/s3/buckets/my_Bucket/static/",
                accessKey: "my_accessKey"
            },
            signature: {
                endpoint: "https://s3.console.aws.amazon.com/s3/buckets/my_Bucket/static/"
            },
            uploadSuccess: {
                endpoint: "https://s3.console.aws.amazon.com/s3/buckets/my_Bucket/static/",
                params: {
                    isBrowserPreviewCapable: qq.supportedFeatures.imagePreviews
                }
            },
            iframeSupport: {
                localBlankPagePath: "https://s3.console.aws.amazon.com/s3/buckets/my_Bucket/static/"
            },
            cors: {
                expected: true
            },
            chunking: {
                enabled: true
            },
            resume: {
                enabled: true
            },
            deleteFile: {
                enabled: true,
                method: "POST",
                endpoint: "https://s3.console.aws.amazon.com/s3/buckets/my_Bucket/static/"
            },
            validation: {
                itemLimit: 5,
                sizeLimit: 15000000
            },
            thumbnails: {
                placeholders: {
                    notAvailablePath: "/server/not_available-generic.png",
                    waitingPath: "/server/waiting-generic.png"
                }
            },
            callbacks: {
                onComplete: function(id, name, response) {
                    var previewLink = qq(this.getItemByFileId(id)).getByClass('preview-link')[0];

                    if (response.success) {
                        previewLink.setAttribute("href", response.tempLink)
                    }
                }
            }
        });

我的views.py是tutorial的复制粘贴。但是，当我尝试上传文件时，会收到以下错误：

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://s3.console.aws.amazon.com/s3/buckets/my_bucket/static/ Reason: CORS header ‘Access-Control-Allow-Origin’ missing)

这令人困惑，因为在我的S3存储桶中，我设置了完全的读写访问权限。此外，我已将CORS配置设置如下：

 <AllowedOrigin>*</AllowedOrigin>
<AllowedMethod>POST</AllowedMethod>
<AllowedMethod>PUT</AllowedMethod>
<AllowedMethod>DELETE</AllowedMethod>
<MaxAgeSeconds>3000</MaxAgeSeconds>
<ExposeHeader>ETag</ExposeHeader>
<AllowedHeader>*</AllowedHeader>

你对我做错了什么有任何想法吗？非常感谢你的帮助！

问候

Answer 1

您确定为Django正确安装和配置了CORS：

安装：pip install django-cors-headers
将模块添加到已安装的应用：

INSTALLED_APPS =（ ... '管道'，的 'corsheaders' ）

添加到中间件类：

MIDDLEWARE_CLASSES =（的 'corsheaders.middleware.CorsMiddleware'， 'django.middleware.common.BrokenLinkEmailsMiddleware'， 'django.middleware.common.CommonMiddleware'， ...）

*请注意，应该在Django的CommonMiddleware之前配置CorsMiddleware（如果你使用的是Django的USE_ETAGS = True设置），否则CORS头将从304未修改的响应中丢失，导致某些浏览器出错。

最后，对于Django，配置CORS服务器白名单。在这里你应该配置S3：

CORS_ORIGIN_ALLOW_ALL =错误

CORS_ORIGIN_WHITELIST =（＆LT; 'YOURDOMAIN＆GT; [：端口]'，）

AWS S3精细上传器，错误：跨源请求被阻止

1 个答案: