问题:当通过对象标记查看图像设置作为数据时，Internet Explorer 11 在通过 Web 服务器查看时不显示它。这是完整的代码:
<!DOCTYPE html>
<html>
<head></head>
<body>
<div style="width:200px; height:100px"><img src="../../square.svg"/></div>
<div style="width:200px; height:100px"><embed src="../../square.svg"></div>
<div style="width:200px; height:100px"><object data="../../square.svg" type="image/svg+xml">Nope</object></div>
</body>
</html>
对于 Firefox 28/Chrome 34，如果我转到该文档的 URL 或在本地打开文档，所有 3 个方 block 都会显示。对于 Internet Explorer 11，在本地查看时，方 block 将全部出现。通过网络服务器查看时，只会出现前两个方 block 。第三次我得到“不”。我确实尝试使用 .png 来查看它是否与 .svg 相关，但我得到了相同的结果。最后，Firefox/Chrome 开发人员工具的网络选项卡显示 GET 返回“svg”类型，但 IE 开发人员工具显示它返回类型“text/html”并中止。是网络服务器问题还是我做错了什么？
要添加更多细节，我在尝试解决另一个问题时遇到了这个问题。所有这一切的最终目标是让外部 .svg 图像填充它们的容器(不保持它们的纵横比不变)。 Firefox 似乎将 .svgs 视为 标签中的普通图像，我可以像普通图像一样拉伸(stretch)它们。 Chrome 似乎想保持其宽高比，而 IE 则一团糟。我希望通过将它们转换为 < object> 我可以强制 .svgs 多一点，但我无法到达那个点进行测试。
编辑:好吧，我无法弄清楚这个问题，但我确实找到了实现我最初目标的解决方案。我正在使用 ajax 请求提取 .svg 图像，修改 viewBox/preserveAspectRatio/width 和 height 属性，然后将 svg 对象放入内联。这很恶心，在缓存方面确实伤害了我，但它适用于我计划支持的所有浏览器。
请求 header 成功:
GET http://127.0.0.1/file/square.svg HTTP/1.1
Accept: text/html, application/xhtml+xml, */*
Referer: http://127.0.0.1/file/xxx/xxx/index3.html
Accept-Language: en-US
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko
Accept-Encoding: gzip, deflate
Host: 127.0.0.1
If-Modified-Since: Fri, 18 Apr 2014 03:31:10 GMT
DNT: 1
Connection: Keep-Alive
Pragma: no-cache
Cookie: vendor_session=xxx
响应成功:
HTTP/1.1 304 Not Modified
content-type: image/svg+xml; charset=UTF-8
last-modified: Fri, 18 Apr 2014 03:31:10 GMT
date: Sat, 19 Apr 2014 01:23:12 GMT
cache-control: private, must-revalidate, max-age=86400
expires: Thu, 01 Jan 1970 00:00:00 GMT
content-length: 0
server: Vendor Web Server/Version
请求失败:
HEAD http://127.0.0.1/file/square.svg HTTP/1.1
Accept: */*
Accept-Encoding: gzip, deflate
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko
Host: 127.0.0.1
Content-Length: 0
DNT: 1
Connection: Keep-Alive
Pragma: no-cache
Cookie: vendor_session=xxx
响应失败:
HTTP/1.1 405 Method Not Allowed
content-type: text/html; charset=UTF-8
date: Sat, 19 Apr 2014 01:33:01 GMT
cache-control: private, must-revalidate
expires: Thu, 01 Jan 1970 00:00:00 GMT
content-length: 839
server: Vendor Web Server/Version
最佳答案
这里的问题是 IE 发出一个 HEAD 请求来确定目标资源的内容类型。您的服务器被配置为拒绝 HEAD 请求(这是一个错误的配置)，因此它会导致 HTTP 错误而不是正确的响应。
您可能可以通过这样更改您的标签来避免此请求:
<object data="../../square.svg" classid="clsid:30590066-98b5-11cf-bb82-00aa00bdce0b" type="image/svg+xml">Nope</object>
...但我可能只是重新配置服务器以不禁止 HEAD 方法。
关于html - IE11 无法通过 Web 服务器显示带有对象标签的图像，但在本地可以正常显示，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23145668/