2010-11-15 4 views
12

Je deviens fou avec le problème suivant qui ne se produit pas sur un autre navigateur (Chrome, Firefox):IE8 ne pas afficher des images (rouge x) ... parfois

  • cache IE8 est effacé
  • Le navigateur démarre ouvre la page HTML/Javascript qui demande et crée dynamiquement quelques images. Cette page HTML est diffusée à partir d'un serveur Tomcat localhost: 8084.
  • La plupart du temps sur les 10 images demandées, IE affiche RED X.
  • Le rapport de l'image du développeur (F12) montre que la taille du fichier est correcte, mais l'image n'est toujours pas affichée. taille du fichier d'images "octets inconnus" et l'image ne fonctionne pas.
  • Parfois, 2 à 4 images sur 10 apparaissent et le reste échoue!
  • Parfois, dans une furie folle de rafraichir 1 milliard de fois, les images apparaissent.
  • Le vrai kicker est que lorsque je mets un point d'arrêt dans mon serveur HTTP, le socket n'est même pas ouvert. IE n'essaie même pas de récupérer les images du serveur avant d'échouer.
  • Et enfin, si je cours le même code mais demande une image de quelque part comme google maps, cela fonctionne dans IE sans problèmes.

Voici mon code javascript:

<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.&markers=color:red|color:red|label:C|40.718217,-73.998284&sensor=false')", 1000); 
    } 
</script> 

Pour serveur HTTP J'utilise exemple BOOST ASIO serveur HTTP Link je l'ai modifié ainsi pour toute demande d'URI, il envoie un fichier .png (je l'ai essayé divers fichiers pour s'assurer que ce n'est pas un encodage PNG c'est mauvais). L'en-tête HTTP a Content-type: "image/png". Le type mime correct est envoyé.

J'ai essayé de trouver une solution pendant longtemps. Lire à travers divers messages:

  • Mime type is the problem. Le type Mime n'est pas le problème dans mon cas. Je définis le type de contenu. J'ai également utilisé le plugin Firefox LiveHTTPHeader pour voir les en-têtes envoyés par le serveur. À l'exception de certains en-têtes de contrôle de cache, mes en-têtes sont les mêmes que ce que google envoie en termes de type de contenu:
  • Security error. Ok, peut-être que les images inter-domaines représentent un risque de sécurité. Ou quelque chose bloque la demande. Eh bien, pourquoi ça n'échoue pas à 100% du temps ?! Pourquoi IE ne demande-t-il pas d'images inter-domaines? Pourtant, maps.google.com demande des travaux, et le mien ne fonctionne que parfois. La même chose s'applique à tout pare-feu ou anti-virus. J'ai également essayé d'exécuter le serveur sur différents ports (80, 8080, 9980).
  • Javascript error. Je pense que le Javascript est correct. Je devais en fait le même problème avec GWT. Donc je pensais que c'était GWT qui était le problème. Et il y avait un bug d'événement avec IE et GWT liés aux images. J'ai donc simplifié le code en Javascript seulement. pas de GWT.
  • Peut-être que c'est l'implémentation du serveur HTTP C++. C'est une possibilité. Cependant, Firefox et Chrome fonctionnent avec le même code sans problèmes.

Des idées? Merci.

EDIT J'ai ajouté myHostName aux sites de confiance. J'ai également réduit les paramètres de sécurité à faible pour les sites internes et Internet. Je vais essayer de désactiver keepalive sur le serveur s'il est activé.Cependant, comme je l'ai mentionné, je ne vois pas IE faire une tentative pour aller chercher l'image du tout. Le socket ne reçoit aucune requête de la part d'IE, donc la suppression de keep-alive des en-têtes peut ne pas aider.

+2

Je dois aimer IE. "Faire du monde un endroit plus en colère">: - O – Bojangles

+0

Avez-vous essayé d'ajouter 'http: // myHostName: 9980 /' à la liste des sites de confiance d'IE? Aussi, si votre serveur HTTP supporte les keep-alives, avez-vous essayé de les désactiver? –

Répondre

12

Vérifiez quel mode couleur vos images sont.

J'ai accidentellement changé le mode couleur d'une image de RGB8 en CMJN dans Photoshop, et a couru dans le même problème. IE8 ne parviendrait pas à afficher l'image, tandis que Firefox n'aurait aucun problème.

+0

Je pensais que c'était l'encodage. Beaucoup de gens se plaignent que IE ne supporte pas la transparence en PNG. J'ai pris l'image générée par google maps qui fonctionne (PNG-8, pas de transparence) l'a enregistrée et c'est ce que mon serveur envoie. – Budric

1

Je crois que dans IE vous devez définir la source après que l'élément est ajouté au DOM, sinon il ne sera pas rendu correctement.

+0

J'ai essayé de modifier le code afin qu'il crée une image, appendChild(), définit img.src. J'ai enlevé image.width/height de javascript. Même comportement – Budric

1

Cela ressemble à un problème avec votre serveur. Quelques choses à essayer, pour affiner le problème:

Voir si cela fonctionne de façon statique. C'est faire une page html plate qui comprend ces images. Est-ce qu'ils se présentent? Essayez de le changer pour que votre minuteur exécute une seule fonction qui fait une boucle, plutôt que d'appeler la minuterie dans une boucle.

Faites-le faire document.write (à la charge de la page, sans minuteurs), écrit simplement le code html pour les éléments (ainsi que les urls afin que vous puissiez voir ce qu'il fait)

faites-le faire , plutôt qu'avec une minuterie, en réponse à un clic sur un bouton de la page. Avoir faire une image à la fois.

Je pense que si vous essayez toutes ces choses, vous arriverez probablement au problème, mais si ce n'est pas le cas, signalez ce qui se passe.

+0

Je vais essayer. Je pensais que c'était un problème avec le serveur HTTP. Mais alors cela fonctionne pour les demandes de Firefox et Chrome - à chaque fois. Si c'est un problème avec JavaScript et document.append *() ou l'ordre des opérations/boucles, alors pourquoi le même code fonctionne-t-il pour maps.google.com URL ... – Budric

+0

Oui, eh bien ça pourrait être un problème de timing qui révèle un bug dans le serveur, cela ne se produit pas sur tous les navigateurs ou à 100% du temps sur le navigateur de problème. – rob

1

J'ai le même problème avec les images qui ne s'affichent pas dans IE8 mais d'autres navigateurs. C'est même le cas avec les fichiers sauvegardés localement. Si j'ouvre avec IE8, je reçois le x rouge, mais tous les autres programmes affichent ok. J'ai regardé les propriétés de l'image et ils sont issus de Photoshop, donc je suppose que c'est le problème CMJN comme indiqué ci-dessus. Si je sauvegarde cette image à l'aide du projet RVB, le problème est résolu.

0

Oui, je ne sais toujours pas quel est le problème. Les gens ont suggéré que c'est CMJN. Si cette solution fonctionne pour vous, c'est génial. J'utilise libPNG pour l'encodage et RGB à tout moment. CMJN n'était pas le problème pour moi.

J'ai implémenté le serveur HTTP en utilisant l'exemple # 3 du serveur http Boost/asio. Ainsi que Java Servlet. Les mêmes problèmes. Parfois ça marche, parfois ça ne marche pas

Je renonce.

Questions connexes