Django 在 AWS S3 中托管 static 个文件，在尝试访问管理字体文件时导致 CORS 错误

Question

I setup Django to store all static files on S3 and with the "collectstatic" command, all the admin files where copied and when I visit the admin site the CSS and JS files are sourced from the S3 bucket correctly. For example:

https://bucket.s3.amazonaws.com/static/admin/css/base.css
https://bucket.s3.amazonaws.com/static/admin/js/vendor/jquery/jquery.js

But when it tries to access the Font files.woff I get the following error:

Access to font at 'https://bucket.s3.amazonaws.com/static/admin/fonts/Roboto-Light-webfont.woff' from origin 'http://localhost:8000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

It's weird that it gives me access to all the files except the font files:

Answer 1

Configuring the following in S3 Bucket Permissions > CORS fixed the issue.

[
    {
        "AllowedHeaders": [
            "Authorization"
        ],
        "AllowedMethods": [
            "GET"
        ],
        "AllowedOrigins": [
            "*"
        ],
        "ExposeHeaders": [],
        "MaxAgeSeconds": 3000
    },
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "HEAD",
            "GET",
            "PUT",
            "POST",
            "DELETE"
        ],
        "AllowedOrigins": [
            "*"
        ],
        "ExposeHeaders": [
            "ETag",
            "x-amz-meta-custom-header"
        ]
    }
]

Answer 2

I remember i faced this issue before with Google Cloud Storage.

You have to make your bucket allow origin cross to your domain.