ASP.NET MVC 引用图标woff2 404问题

103 阅读1分钟

本地调试ASP.NET MVC项目,引用Layui框架,在路径正确且文件存在的情况下,控制台报错:layui iconfont.woff2?v=256 404

问题原因

浏览器无法识别woff2后缀的扩展文件

解决方案

添加MIME映射

项目根目录Web.config文件中的<system.webServer>节点添加子节点:

<staticContent>
    <remove fileExtension=".woff"/>
    <mimeMap fileExtension=".woff" mimeType="application/x-font-woff" />
    <remove fileExtension=".woff2"/>
    <mimeMap fileExtension=".woff2" mimeType="application/x-font-woff2" />
    <remove fileExtension=".ttf" />
    <mimeMap fileExtension=".ttf" mimeType="application/x-font-truetype" />
    <remove fileExtension=".svg" />
    <mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
    <remove fileExtension=".otf" />
    <mimeMap fileExtension=".otf" mimeType="application/x-font-opentype" />
    <remove fileExtension=".eot" />
    <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
</staticContent>

如果项目部署到IIS,找到网站,右键属性,添加MIME类型。如果不起效,打开IIS,点击根节点添加。

补充

MIME类型就是设定某种扩展名的文件用一种应用程序来打开的方式类型,当该扩展名文件被访问的时候,浏览器会自动使用指定应用程序来打开。

文件扩展名MIME类型
.svgimage/svg+xml
.woffapplication/x-font-woff
.woff2application/x-font-woff
.f4vapplication/octet-stream
.flvapplication/octet-stream
.mp4video/mp4