IE8不显示图像（红色x）......有时候

本文介绍了IE8不显示图像（红色x）......有时候的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我很生气，以下问题在任何其他浏览器（Chrome，Firefox）上都没有发生：

IE8缓存已清除

浏览器启动会打开请求并动态创建一些图像的HTML / Javascript页面。此HTML页面由Tomcat服务器localhost：8084提供。

在请求的10个图像中，大多数时候IE显示RED X.

开发者图像报告（F12）将一些图像文件大小显示为正确的＃字节，但图像仍未显示，或者某些图像文件大小为未知字节且图像不起作用。

有时候，有10个图像中有2-4个出现，其余的图像都出现了！

有时候，在疯狂的狂欢中，有10亿次刷新，图像会出现。

真正的问题是当我在HTTP服务器中设置断点时，套接字甚至都没有打开。 IE甚至没有尝试在失败之前从服务器获取图像。

最后如果我运行相同的代码但是从谷歌地图等某个地方请求图像，它可以在没有IE的情况下运行这是我的javascript代码：
```
 < script type =text / javascript> 
 var ctr = 0; 
函数getImage（url）
 {
 var img = document.createElement（img）; 
 img.src = url +& nc =+ ctr; 
 ctr ++; 
 img.width = 128; 
 img.height = 128; 
 document.body.appendChild（img）; 
} 
 
 for（var i = 0; i< 10; i = i + 1）
 {
 //这个失败的时间最多
 setTimeout（getImage（'http：// myHostName：9980 / GenerateImageStatic？parameter = 1'），1000）; 
 //这个工作！为什么？ 
 //setTimeout(\"getImage('http://maps.google.com:80/maps/api/staticmap?center=Brooklyn+Bridge,New+York,NY&zoom=14&size=512x512&地图类型=路线&安培;标记=颜色：蓝|标签：S | 40.702147，-74.015794&安培;标记=颜色：绿|标签：G | 40.711614，-74.012318&安培;标记=颜色：红|颜色：红色|标签：C | 40.718217，-73.998284& sensor = false'），1000）; 
} 
< / script> 
  
```
对于HTTP Server我正在使用BOOST示例ASIO HTTP Server 我修改了它，以便对任何URI请求，它发送一个png文件（我尝试过各种文件以确保它不是PNG编码那么糟糕）。 HTTP标头具有Content-type：image / png。所以发送了正确的mime类型。

我一直试图找到解决方案很长一段时间。阅读各种帖子：
- 。在我的情况下，Mime类型不是问题。我设置了Content-type。我还使用Firefox LiveHTTPHeader插件查看从服务器发送的标头。除了一些缓存控制标题，我的标题与Google内容类型相同：
- 。好吧，也许跨域图像存在安全风险。或者某些东西阻止了请求。那么为什么它不会100％失败？！为什么IE不会请求任何跨域图像？但是maps.google.com请求有效，而我的有时只能使用。同样适用于任何防火墙或防病毒软件。我也尝试在各种端口上运行服务器（80,8080,9980）。
- 。我认为Javascript是正确的。我实际上遇到了与GWT相同的问题。所以我认为GWT就是问题所在。并且IE和GWT存在与图像相关的事件错误。所以我将代码简化为Javascript。没有GWT。
- 也许这是C ++ HTTP Server的实现。这是一种可能性。但Firefox和Chrome使用相同的代码没有问题。
有什么想法吗？
谢谢。

编辑
我将myHostName添加到受信任的网站。我还将内部和互联网站点的安全设置降低到了低。如果启用，我将尝试在服务器上禁用keepalive。但是正如我所提到的，我没有看到IE尝试获取图像。套接字没有收到来自IE的任何请求，因此从头文件中删除keep-alive可能无济于事。
解决方案
检查颜色是什么颜色您的图片所在的模式。

我在Photoshop中意外地将图像的颜色模式从RGB8切换到CMYK，并遇到了同样的问题。 IE8无法显示图像，而Firefox根本没有问题。

I'm going mad with the following problem which does not happen on any other browser (Chrome, Firefox):
- IE8 cache is cleared
- browser starts opens HTML/Javascript page that requests and creates a few images dynamically. This HTML page is served from a Tomcat server localhost:8084.
- Most of the time out of 10 images that are requested IE displays RED X.
- Developer Image Report (F12) shows some images "file size" as correct # bytes, yet the image is still not displayed, or some images file size "unknown bytes" and image doesn't work.
- Sometimes 2-4 out of 10 images show up and the rest fail!
- Sometimes in a mad fury of hitting refresh 1 billion times, the images show up.
- The real kicker is that when I put a break point in my HTTP Server, the socket isn't even opened. IE isn't even attempting to fetch the images from the server before failing.
- And finally if I run the same code but request an image from somewhere like google maps, it works in IE without problems.
Here's my javascript code:
```
<script type="text/javascript">
    var ctr = 0;
    function getImage(url)
    {
        var img = document.createElement("img");
        img.src = url + "&nc=" + ctr;
        ctr ++;
        img.width = 128;
        img.height = 128;
        document.body.appendChild(img);
    }

    for (var i = 0; i < 10; i=i+1)
    {
        //THIS FAILS MOST OF THE TIME
        setTimeout("getImage('http://myHostName:9980/GenerateImageStatic?parameter=1')", 1000);
        //THIS WORKS! WHY?
        //setTimeout("getImage('http://maps.google.com:80/maps/api/staticmap?center=Brooklyn+Bridge,New+York,NY&zoom=14&size=512x512&maptype=roadmap&markers=color:blue|label:S|40.702147,-74.015794&markers=color:green|label:G|40.711614,-74.012318&markers=color:red|color:red|label:C|40.718217,-73.998284&sensor=false')", 1000);
    }
</script>
```
For HTTP Server I'm using BOOST sample ASIO HTTP Server Link I modified it so for any URI request, it sends a png file (I've tried various files to make sure it's not PNG encoding that's bad). The HTTP header has Content-type: "image/png". So correct mime type is sent.
I've been trying to find a solution for a long time. Read through various posts:
- Mime type is the problem. Mime type is not the problem in my case. I set the Content-type. I've also used Firefox LiveHTTPHeader plugin to view the headers sent from the server. Except for some cache control headers, my headers are same as what google sends in terms of Content-type:
- Security error. Ok maybe the cross domain images are a security risk. Or something is blocking the request. Well then why doesn't it fail 100% of the time?! Why does IE not request any cross domain images? Yet maps.google.com request works, and mine only works sometimes. Same applies to any firewall or anti-virus. I've also tried running the server on various ports (80, 8080, 9980).
- Javascript error. I think the Javascript is correct. I was actually getting the same problem with GWT. So I thought it was GWT that was the problem. And there was an event bug with IE and GWT related to images. So I simplified the code to just Javascript. no GWT.
- Maybe it's the C++ HTTP Server implementation. It's a possibility. However Firefox and chrome work with the same code without problems.
Any ideas?Thanks.
EDITI added myHostName to trusted sites. I also lowered the security settings to low for internal and internet sites. I'm going to try to disable keepalive on the server if enabled. However as I mentioned I don't see IE making an attempt to fetch the image at all. The socket doesn't receive any requests from IE, so removing keep-alive from headers may not help.
解决方案
Check what color mode your images are in.
I have accidentally switched the color mode of an image from RGB8 to CMYK in Photoshop, and ran into the same problem. IE8 would fail to display the image, while Firefox would have no trouble at all.

这篇关于IE8不显示图像（红色x）......有时候的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！