Win7系统解决使用MyEclipse进行Web开发中网页无法显示.woff矢量图标的问题

昨天在开发前端页面时遇到了Bootstrap框架所引用的.woff字体矢量图标无法正常显示的问题：

检查了路径，发现路径都是正确的：

于是在网上搜索了一下，发现很可能是服务器上IIS没有添加.woff字体矢量图标的MIME类型，导致发送HTTP请求时，IIS无法处理和识别此类型的文件。但是尝试了网上的很多方法，遇到了很多坑之后才把问题解决。现在记录下整个过程，希望可以帮到别人少走弯路。

解决方法如下:

1.开启IIS服务
首先依次打开“开始”–>”控制面板”：

然后进入”程序”:

再点击”打开或关闭Windows功能”:

这时会弹出新的窗口,等待加载完成后就会看到下面这个页面:

将”Internet服务信息”里的勾全打上,就像这样:

点击”确定”后,在”开始”–>”管理工具”中就可以查看到IIS管理器:

到这里，就开启了IIS信息管理服务，接着进入下一步。

2.设置”MIME类型”,让IIS识别.woff,.woff2文件格式

接着上一步的操作，点击进入”Internet信息服务(IIS)管理器”,会进入下面这个窗口:

找到”MIME类型”:

双击后会看到设置窗口:

在空白区域点击右键,选择”添加”就会弹出这个窗口:

最后将下面的内容对应输入:

.woff
application/x-font-woff

.woff
2
application/x-font-woff

添加成功后，IIS就可以识别.woff和.woff2格式文件了，但是要想在网页上正确显示，还需要最后一步。

3.设置MyEclipse中项目目录下的”web.xml”文件

打开项目的”web.xml”文件,添加下面的代码:

servlet-mapping>  <servlet-name>default</servlet-name>  <url-pattern>*.woff</url-pattern></servlet-mapping><servlet-mapping>  <servlet-name>default</servlet-name>  <url-pattern>*.woff2</url-pattern></servlet-mapping>

最后重新加载页面,就会看到字体图标可以正常显示:

到此问题成功解决!