0

我目前正在通过 GitHub Pages 托管一个 React/Gatsby 项目，我一直在弄乱 fonts.com 和他们的网络字体系统来获取 Rockwell 字体。我按照将脚本标签输入到我的代码部分的说明进行操作：

<script type="text/javascript" src="//fast.fonts.net/jsapi/0a390850-37c6-420c-8ead-c15e81202559.js"></script>

在引用我的域时，我遵循了他们的所有建议，并且遇到了这个有趣的错误。

  1. 字体在 Firefox 中正常加载。

    一个。更新：这不是真的，它也被缓存在那里。

  2. 当我运行“gatsby develop”并让我的项目在 localhost:8000 中运行时，字体也会加载

    一个。（我知道它可以在 localhost 中工作，因为我使用了 Chrome 的漂亮的“空缓存和硬重新加载”功能。）

  3. 然而，当我在 Chrome 中拉出页面时，出现以下错误

    GET https://fast.fonts.net/dv2/14/8dd355f9-1a9a-4d91-8aa1-7dcc9deeb439.woff2?d44f19a684109620e4841578a490e8187cac2bf7466ecccd35f843ec9e8410dc73fea4cea7acbbbaf9d830e48fc615a792f4b24a1c10853efb77f66879fc39a15a09593f079cf7a38cb48dd4836fa2ebba1b54d33b577d893508a6f4d0526453533728dec4671fee2d130ac32d5b8a97d5&projectId=0a390850-37c6-420c-8ead-c15e81202559 net::ERR_ABORTED

所以要么出现，要么我得到一个 403 错误。（我已经按照他们发布的解决 403 错误的建议。）

我用谷歌搜索并弄乱了无济于事。我发现了一个类似的问题，建议在 css 中使用 @import，但这不起作用，因为它是一个 javascript 文件

据我所知，它与加载字体的 woff2 部分特别有关，但我不能删除该部分，因为它是一种网络字体。不知何故，这导致了一个 net::ERR_ABORTED。这可能与盖茨比的出版方式有关吗？或者 React 如何处理在 ?

感谢您提供的任何建议！

更新： Firefox 已将其缓存。这让我相信 Webpack 正在弄乱脚本标签/下载的东西。

4

1 回答 1

0

好吧，我解决了这个问题。当项目托管在项目域 (www.mywebsite.com/project) 上时，我在网络调用的深处看到请求本身来自常规域 (www.mywebsite.com)。所以我不得不在列出的域中进行调整。

于 2017-11-16T18:13:31.563 回答