当 运行 collectstatic 并将所有内容放在 S3 上时，Wagtail 管理图标消失
Wagtail admin icons disappear when running collectstatic and putting everything on S3
我一直在本地和我的服务器上工作，一切看起来都很好。然后我配置 django-storages 以将静态文件和媒体存储在我的 S3 存储桶中。除了管理界面上的 icons/glyphicons 以外，一切正常。我看到的不是漂亮的图形图标，而是字母。
例如，一旦您登录，您就会在左侧看到搜索栏。通常你会在搜索框中看到一个镜子。我丢了镜子，现在只看到一个小写的 f.
我的问题是这样的。我要搜索什么来开始调试呢？ collectstatic 没有收集什么 wagtail 文件？
重现步骤
- 设置一个鹡鸰站点
- 在 s3 上设置存储桶
- 安装 django-storages
- 配置 django-storages 以使用您的存储桶
./manage.py collectstatic
技术细节
- Python版本：3.5.2
- Django 版本：1.11.5
- 鹡鸰版本：1.12.2
- 浏览器版本：firefox、chromium、chrome
这是因为 Wagtail 使用图标字体，而当前的浏览器不允许从远程域加载字体，除非它们包含有效的 CORS HTTP headers。您可以通过将以下行添加到您的设置文件来配置 django-storages S3 后端以添加适当的 headers：
AWS_HEADERS = {
'Access-Control-Allow-Origin': '*'
}
和re-running./manage.py collectstatic。有关一些附加说明，请参阅 https://github.com/wagtail/wagtail/issues/633#issuecomment-55935529。
我使用了 wagtail==2.5.1 和 django==2.2.1 从 aws s3 静态获取。
问题出在 boto s3 的凭据上。当我更新凭据并使 manage.py collectstatic 所有静态加载和网站运行良好时））
我也运行关注这个问题。从 django-storages v1.9 开始，它使用 boto3 instead of boto. The "AWS_HEADERS" fix by gasman does not work for boto3. However, setting these CORS rules in Amazon S3, which I found here，为我解决了这个问题：
<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
<AllowedOrigin>*</AllowedOrigin>
<AllowedMethod>GET</AllowedMethod>
<MaxAgeSeconds>3000</MaxAgeSeconds>
<AllowedHeader>Authorization</AllowedHeader>
</CORSRule>
</CORSConfiguration>
如链接 github 回复中所述，最好更新
<AllowedOrigin>*</AllowedOrigin>
到
<AllowedOrigin>http://www.example.com</AllowedOrigin>
这是 CORS 设置的 Amazon documentation。
我正在使用 wagtail==2.10.1 和 django==3.1.1 并使用 Digital Ocean Spaces（AWS s3 的 DO 版本）。我 运行 遇到了同样的问题，但解决方案不起作用（毕竟自发布以来已经两年了......）。我意识到这是因为解决方案已发布，django-storages 和 boto3 已更新。他们的配置设置格式已更改。
因此，如果您在鹡鸰上使用 django-storage 的 boto3 依赖项，您可以从@gasman 替换此解决方案：
AWS_HEADERS = {
'Access-Control-Allow-Origin': '*'
}
使用此更新代码：
AWS_S3_OBJECT_PARAMETERS = {
'ACL':'public-read',
}
我知道 public-read 可能存在安全问题，但这正是它对我有用的原因。
我一直在本地和我的服务器上工作，一切看起来都很好。然后我配置 django-storages 以将静态文件和媒体存储在我的 S3 存储桶中。除了管理界面上的 icons/glyphicons 以外，一切正常。我看到的不是漂亮的图形图标，而是字母。
例如，一旦您登录，您就会在左侧看到搜索栏。通常你会在搜索框中看到一个镜子。我丢了镜子，现在只看到一个小写的 f.
我的问题是这样的。我要搜索什么来开始调试呢？ collectstatic 没有收集什么 wagtail 文件？
重现步骤
- 设置一个鹡鸰站点
- 在 s3 上设置存储桶
- 安装 django-storages
- 配置 django-storages 以使用您的存储桶
./manage.py collectstatic
技术细节
- Python版本：3.5.2
- Django 版本：1.11.5
- 鹡鸰版本：1.12.2
- 浏览器版本：firefox、chromium、chrome
这是因为 Wagtail 使用图标字体，而当前的浏览器不允许从远程域加载字体，除非它们包含有效的 CORS HTTP headers。您可以通过将以下行添加到您的设置文件来配置 django-storages S3 后端以添加适当的 headers：
AWS_HEADERS = {
'Access-Control-Allow-Origin': '*'
}
和re-running./manage.py collectstatic。有关一些附加说明，请参阅 https://github.com/wagtail/wagtail/issues/633#issuecomment-55935529。
我使用了 wagtail==2.5.1 和 django==2.2.1 从 aws s3 静态获取。
问题出在 boto s3 的凭据上。当我更新凭据并使 manage.py collectstatic 所有静态加载和网站运行良好时））
我也运行关注这个问题。从 django-storages v1.9 开始，它使用 boto3 instead of boto. The "AWS_HEADERS" fix by gasman does not work for boto3. However, setting these CORS rules in Amazon S3, which I found here，为我解决了这个问题：
<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
<AllowedOrigin>*</AllowedOrigin>
<AllowedMethod>GET</AllowedMethod>
<MaxAgeSeconds>3000</MaxAgeSeconds>
<AllowedHeader>Authorization</AllowedHeader>
</CORSRule>
</CORSConfiguration>
如链接 github 回复中所述，最好更新
<AllowedOrigin>*</AllowedOrigin>
到
<AllowedOrigin>http://www.example.com</AllowedOrigin>
这是 CORS 设置的 Amazon documentation。
我正在使用 wagtail==2.10.1 和 django==3.1.1 并使用 Digital Ocean Spaces（AWS s3 的 DO 版本）。我 运行 遇到了同样的问题，但解决方案不起作用（毕竟自发布以来已经两年了......）。我意识到这是因为解决方案已发布，django-storages 和 boto3 已更新。他们的配置设置格式已更改。
因此，如果您在鹡鸰上使用 django-storage 的 boto3 依赖项，您可以从@gasman 替换此解决方案：
AWS_HEADERS = {
'Access-Control-Allow-Origin': '*'
}
使用此更新代码：
AWS_S3_OBJECT_PARAMETERS = {
'ACL':'public-read',
}
我知道 public-read 可能存在安全问题，但这正是它对我有用的原因。