javascript Bootstrap woff2 字体未正确加载

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/29842583/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 11:10:16  来源:igfitidea点击:

Bootstrap woff2 font not getting loaded correctly

javascriptasp.net-mvccsstwitter-bootstrap-3woff2

提问by V.J.

Bootstrap font not loading correctly glyphicons-halflings-regular.woff2.

Bootstrap 字体未正确加载 glyphicons-halflings-regular.woff2。

It shows the error in my Chrome-console.

它显示了我的 Chrome 控制台中的错误。

Any solution to get it loaded properly, so that it doesn't show the error in the console?

有什么解决方案可以让它正确加载,这样它就不会在控制台中显示错误?

回答by hina10531

Since you put a asp.net-mvc tag on your post, I'm giving you IIS configuration solution for you.

由于您在帖子上放置了 asp.net-mvc 标签,因此我为您提供了 IIS 配置解决方案。

Chrome doesn't consume woff and throws 404 error when your web server isn't configured with MIME type 'woff' or 'woff2'.

当您的 Web 服务器未配置 MIME 类型“woff”或“woff2”时,Chrome 不会消耗 woff 并引发 404 错误。



You need to add IIS a MIME-TYPE for woff2. You can configure it in web.xml.

您需要为 woff2 添加 IIS 一个 MIME-TYPE。您可以在 web.xml 中配置它。

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


And you can also do this through IIS manager.

您也可以通过 IIS 管理器执行此操作。

  1. open IIS manager
  2. Features View -> MIME Types
  3. Actions -> Add
  4. You will see add MIME Type box and put woff2 extension in the file extension ".woff2"
  5. and MIME type as "application/font-woff2" as well.
  1. 打开 IIS 管理器
  2. 功能视图 -> MIME 类型
  3. 操作 -> 添加
  4. 您将看到添加 MIME 类型框并将 woff2 扩展名放在文件扩展名“.woff2”中
  5. MIME 类型也为“application/font-woff2”。


IIS manager workthrough via images.

IIS 管理器通过图像解决。

enter image description hereenter image description hereenter image description here

在此处输入图片说明在此处输入图片说明在此处输入图片说明

回答by bondus

The same problem was resolved by adding for IIS the tags in Web.configin, under the Views folder.

通过在 Views 文件夹下为 IIS 添加Web.config中的标记解决了相同的问题。

回答by sumit sharma

A small hack 1) search glyphicons-halflings-regular.woff 2) Copy glyphicons-halflings-regular.woff as glyphicons-halflings-regular.woff2 3) Put this is required folder. It worked in my case.

一个小技巧 1) 搜索 glyphicons-halflings-regular.woff 2) 将 glyphicons-halflings-regular.woff 复制为 glyphicons-halflings-regular.woff2 3) 把这是必需的文件夹。它在我的情况下有效。