问题:通过对象标签将图像设置作为数据查看时,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 个方块都会显示。对于 Internet Explorer 11,在本地查看时,这些方块将全部显示。通过网络服务器查看时,只会出现前两个方块。第三次我得到“不”。我确实尝试使用 .png 来查看它是否与 .svg 相关,但我得到了相同的结果。最后,Firefox/Chrome 开发者工具的网络选项卡显示 GET 返回“svg”类型,但 IE 开发者工具显示返回类型“text/html”并中止。是网络服务器的问题,还是我做错了什么?
为了添加更多细节,我在尝试解决另一个问题时遇到了这个问题。所有这一切的最终目标是让外部 .svg 图像填充其容器(不保持其纵横比不变)。 Firefox 似乎将 .svgs 视为 标签中的普通图像,我可以像平常一样拉伸它们。 Chrome 似乎想保持其宽高比,而 IE 则一团糟。我希望通过将它们转换为
编辑:嗯,我无法弄清楚这个问题,但我确实找到了实现我最初目标的解决方案。我使用 ajax 请求拉取 .svg 图像,修改 viewBox/preserveAspectRatio/width 和 height 属性,然后将 svg 对象内联。它很恶心,并且在缓存方面确实伤害了我,但它适用于我计划支持的所有浏览器。
请求标头成功:
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