我有一个正在开展的项目,该项目托管在 Digital Ocean 的应用平台上。 在开发中,我本地存储的字体工作得很好。一旦我将我的项目加载到 Digital Ocean 上,它们就不再工作了。 我使用 Digital Ocean 的空间来存放静态文件和上传的文件。
我的 CSS 看起来像这样:
/* Fonts */
@font-face {
font-family: 'canto';
src: url('../fonts/Canto-Bold.woff2') format('woff2');
}
@font-face {
font-family: 'Poppins';
src: url('../fonts/Poppins-Light.woff2') format('woff2');
}
@font-face {
font-family: 'canto-roman';
src: url('../fonts/Canto-Roman.woff2') format('woff2');
}
@font-face {
font-family: 'poppins-bold';
src: url('../fonts/Poppins-SemiBold.woff2') format('woff2');
}
我也测试过:
/* Fonts */
@font-face {
font-family: 'canto';
src: url('/static/fonts/Canto-Bold.woff2') format('woff2');
}
这在开发中也能正常工作,但在生产中却不行。 我的文件夹结构如下所示:
-Project
--app
--app
--templates
--media
--static
---static/CSS -> .CSS file
---static/fonts/ font files
所有其他文件都可以正常工作,只是字体不行。 我已经用两台独立的计算机对此进行了测试。两者都没有安装字体。 我错过了什么吗?
编辑: 我还将 CORS 配置添加到我的间隔桶中,看看是否能解决问题。没有运气。
编辑2: 控制台给我这个错误:
Failed to load resource: the server responded with a status of 403 () Canto-Bold.woff2:1
所以出于某种原因服务器不会让我加载字体。有人知道为什么吗?
我通过手动选择我的 Spaces 存储桶中的字体文件并将它们的权限设置为公开来设法让它工作。 不是最理想的解决方案,但它有效。