Chrome未将SVG文件加载为image/svg + xml

Question

我有一个SharePoint网页,它引用存储在 img标记内的SharePoint列表的RootFolder中的SVG文件:

<img src='http://localhost/Lists/MyList/1/1.svg' type='image/svg+xml' />

图像在桌面上以及iOS设备(Safari)上的IE9中正确呈现.但是,在Windows上的Chrome中(我目前使用的是v14)无法显示.它改为渲染破碎的图像图标.

Chrome中的网络选项卡显示文件1.svg是作为application/octet-stream下载的(因此渲染不正确).我需要更改什么才能让Chrome正确识别MIME类型(如标记中所指定)？它可能是Chrome中的一个错误(正如这个SO答案所示)？如果是这样,是否有办法以另一种方式加载SVG文件(例如,嵌入标签)？

请注意,IE的调试器(F12)正确地将类型标识为image/svg + xml,因此会按预期呈现图像.

编辑:由于它似乎是一个服务器端问题(感谢@robertc)我添加了这样一个事实,即该文件由SharePoint提供,怀疑SharePoint可能无法识别MIME类型.

Answer 1

没有属性type上的img元素,你需要正确设置MIME类型的服务器上.我认为它只适用于IE,因为它正在进行内容嗅探.

在IIS7及更高版本上,您可以web.config在以下system.webServer部分的文件中指定MIME类型映射:

<staticContent>
  <mimeMap fileExtension=".svg" mimeType="image/svg+xml"/>
</staticContent>

之后它应该适用于所有浏览器,但您可能需要强制刷新(Ctrl + F5)才能让它们再次请求文件.