Font-Awesome 字体 (woff) 未通过 Netlify CDN 加载

标签 font-awesome webfonts netlify

我有一个 Netlify CDN 通过我的 GitHub 拉取文件,除了加载字体外,一切似乎都很好。我对 CDN 比较陌生,但已经研究和学习了很多。

但是......我花了 4 个小时研究如何启用它,我在他们的文档或其他任何有类似问题的人中唯一能找到的就是我需要在根目录中创建一个 _header 文件,但他们没有' 不指定与字体有关的任何事情。他们只是告诉我这个示例代码。

网站链接:
https://www.netlify.com/docs/headers-and-basic-auth/

示例标题:

## A path:
/templates/index.html
  # Headers for that path:
  X-Frame-Options: DENY
  X-XSS-Protection: 1; mode=block
/templates/index2.html
  X-Frame-Options: SAMEORIGIN

有人对这个有经验么?我正要去寻找一个新的 CDN,但不确定还有谁是可靠的。

最佳答案

Netlify 允许您使用 netlify.toml 中的结构化配置在页面中设置标题。文件。

要为 woff 内容类型添加标题,您需要一个等效于的标题:

/*.woff
    Access-Control-Allow-Origin: *
    Content-Type: application/font-woff

使用 Netlify Tool要测试有效的 header ,您在配置中的设置将是:
netlify.toml
[[headers]]
  for = "/*.woff"
  [headers.values]
    Access-Control-Allow-Origin = "*"
    Content-Type = "application/font-woff"
netlify.toml文件存在于 Netlify 站点的根目录下。
路径也需要有效,以上只是一个例子。

关于Font-Awesome 字体 (woff) 未通过 Netlify CDN 加载,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48140474/

相关文章:

html - 当鼠标悬停在 "fa icon"上时如何改变它的颜色?

css - Font Awesome 在客户端环境中不起作用

css - 当我使用 font awesome css 时,大写字母 G + 显示而不是 g+

gatsby - 如何处理 `gatsby js` 项目中的文件上传?

svelte - 如何在 sveltekit netlify 中使用文件 api

reactjs - React Font Awesome,如何使用额外的类,比如 'fa-fw'

html - 嵌入字体未渲染或下载

css - 网站上的文字被压扁

html - 即 : Issues :( incorrect webfont display

javascript - nuxt 应用程序部署到 Netlify : fetch to api working locally, 但不在部署的站点上:收到 404