jQuery在@font-face上抛出错误。

Question

我正在本地进行一个项目，但是我的@fontface出现了jquery错误。

这是我的错误提示：

jquery-1.11.0.min.js:2 GET http://localhost:9000/ostrich-regular-webfont.woff2

这是我的工作目录：

src
| -img
| -scripts
| -styles
     -main.css
     -fonts
          -font files are here
| -index

我的@font-face：

@font-face {
font-family: 'ostrich_sansmedium';
src: url('ostrich-regular-webfont.eot');
src: url('ostrich-regular-webfont.eot?#iefix') format('embedded-opentype'),
     url('ostrich-regular-webfont.woff2') format('woff2'),
     url('ostrich-regular-webfont.woff') format('woff'),
     url('ostrich-regular-webfont.ttf') format('truetype'),
     url('ostrich-regular-webfont.svg#ostrich_sansmedium') format('svg');
font-weight: normal;
font-style: normal;

}

我尝试了不同的URL变体，包括：

 url('fonts/ostrich-regular-webfont.svg#ostrich_sansmedium'),
 url('styles/fonts/ostrich-regular-webfont.svg#ostrich_sansmedium') 

我需要一些建议吗？非常感谢您的任何帮助！

- angelina bethoney

---

你确定是 jQuery 抛出了这个错误吗？错误是什么？404？ - user1017882

也许你没有那个字体文件。 - Harsh

我仔细检查过了，我肯定把所有字体放在正确的文件夹中了。我从fontsquirrel.com下载了这些字体和@font-face声明。 - angelina bethoney

只是确认一下，你的变量是正确的。你需要先将它指向“fonts”目录。既然这样不起作用，看看我的答案吧。 - user1017882

我在我的托管中进行了检查 - http://szsi.com.ua/page/site-2/ 可以正常工作，字体路径为url('fonts/name_font')。 - Dmitriy

Answer 1

当IIS没有正确配置时，我经常看到这些与字体文件相关的错误。如果你确定文件存在（你尝试修复它的路径看起来正确），那么可能是因为IIS不确定如何提供这些文件（即它们会404，因为用户无法下载它们，因为IIS不会提供它们）。在你的web.config文件中添加以下内容：

<configuration>
  <system.webServer>
    <staticContent>
      <mimeMap fileExtension=".woff2" mimeType="application/font-woff2" />

很显然，mimeMap条目将位于其父节点中已存在的任何位置，并且您必须关闭它们。我只是为了帮助您确定它应该放在哪里而包含了这个信息。

- user1017882

---

是的，它通常会这样做。你目前使用什么来构建网站？ - user1017882

mithril.js，gulp，browserify - angelina bethoney

恐怕我对那些一无所知。不过，判断它是否是“服务”问题而不是损坏的路径或引用的好方法是尝试直接导航到它。http://localhost:9000/fonts/ostrich-regular-webfont.woff2 - 点击它 - 你能到达字体吗？ - user1017882

听起来是这样。我不想建议您创建一个Web配置文件，因为我不确定您目前使用的构建工具 - 不想让您白费力气。我会帮您查一下... - user1017882

是的，gulp已经设置好了。每当我尝试将文件导入我的LESS样式表（例如-defaults.less）时，我也会收到404错误，所以这肯定与我的服务器有关。不确定这是否有帮助，但这是我正在运行的样板：https://github.com/velveteer/mithril-boilerplate - angelina bethoney