Django CSS 相对路径在 Amazon S3 中不起作用答案

【问题标题】：Django CSS relative paths not working in Amazon S3Django CSS 相对路径在 Amazon S3 中不起作用
【发布时间】：2018-10-10 14:51:23
【问题描述】：

基本上，我将 S3 用于网站的静态文件。模板中引用了大多数图像，但我注意到每个引用的图像或文件（特别是字体）都不起作用。

我已经在 S3 中公开了所有文件，并且可以通过公共链接访问它们。

这是我的设置.py

STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'app/static'),
]

AWS_ACCESS_KEY_ID = ''
AWS_SECRET_ACCESS_KEY = ''
AWS_STORAGE_BUCKET_NAME = 'abc-bucket'
AWS_S3_CUSTOM_DOMAIN = '%s.s3.amazonaws.com' % AWS_STORAGE_BUCKET_NAME

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

AWS_LOCATION = 'static'
STATICFILES_STORAGE = 'storages.backends.s3boto3.S3Boto3Storage'
STATIC_URL = "https://%s/%s/" % (AWS_S3_CUSTOM_DOMAIN, AWS_LOCATION)

DEFAULT_FILE_STORAGE = 'app.storage_backends.MediaStorage'

我已经删除了这篇文章的 AWS 访问密钥和密钥。

fonts.css 包含以下内容；

@font-face {
    font-family: 'rt-icons-2';
    src:url('../../fonts/rt-icons-23dab.eot?wz19bt');
    src:url('../../fonts/rt-icons-2d41d.eot?#iefixwz19bt') format('embedded-opentype'),
        url('../../fonts/rt-icons-23dab.ttf?wz19bt') format('truetype'),
        url('../../fonts/rt-icons-23dab.woff?wz19bt') format('woff'),
        url('../../fonts/rt-icons-23dab.svg?wz19bt#rt-icons-2') format('svg');
    font-weight: normal;
    font-style: normal;
}

AWS 文件夹结构是；

 static
 - content
   - css 
     - fonts.css
 - fonts
   - rt-icons-23dab.eot
   - rt-icons-2d41d.eot
   - rt-icons-23dab.ttf
   - rt-icons-23dab.woff
   - rt-icons-23dab.svg

我知道 CSS 工作正常，因为所有样式都很好，因此可以正常访问 fonts.css，但相关路径已损坏，并且所有字体图标都丢失了。在我运行 collectstatic 并将它们移至 S3 之前，这些工作正常。

【问题讨论】：

你做了collectstatic吗？这个路径app/static有静态文件吗？
您好，两者都是。我什至尝试将完整的公共 S3 链接放入其中，但仍然无法正常工作。这些文件绝对是公开的，因为我可以点击这些文件并查看它们。

标签： css django amazon-s3

【解决方案1】：

找到答案here。 CORS 配置是问题所在。

【讨论】：