1

I've got an HTML page.

Inside an <img> tag, the src= points to an external website:

<img src="http://a.website.com/an_image.jpg" />

In firefox, the image doesn't load. However, if I inspect the element with firebug, hovering on the link will show me the correct thumbnail (as firebug does), so I know the link is correct.

Also, in Chrome the same image loads fine.

Why is it not loading in Firefox?

Additional details that may/may not be useful:

  • It's a python Django application running locally with the development server
  • Application: Firefox 9.0.1 (20111228084940)
  • Operating System: Linux (x86_64-gcc3)

[EDIT] Plugins:

  • [EDIT] Plugins removed -- no need for them, the problem turned out to be different

[EDIT] Posted below are the request headers from Firefox and Chromium respectively:

Firefox:

Accept  image/png,image/*;q=0.8,*/*;q=0.5
Accept-Charset  ISO-8859-1,utf-8;q=0.7,*;q=0.7
Accept-Encoding gzip, deflate
Accept-Language en-gb,it-it;q=0.7,it;q=0.3
Cache-Control   max-age=0
Connection  keep-alive
Host    ia.media-imdb.com
If-Modified-Since   Fri, 03 Sep 2010 17:18:00 GMT
Referer http://127.0.0.1:8001/bulk_action/
User-Agent  Mozilla/5.0 (Ubuntu; X11; Linux x86_64; rv:9.0.1) Gecko/20100101 Firefox/9.0.1

Chromium:

Accept: */ *
Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-GB,en-US;q=0.8,en;q=0.6
Cache-Control:max-age=0
Connection:keep-alive
Host:ia.media-imdb.com
If-Modified-Since:Fri, 03 Sep 2010 17:18:00 GMT
Referer:http://localhost:8001/bulk_action/
User-Agent:Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/535.7 (KHTML, like Gecko) Ubuntu/11.10 Chromium/16.0.912.75 Chrome/16.0.912.75 Safari/535.7
gozzilli
  • 8,089
  • 11
  • 56
  • 87
  • 1
    atleast show a part of your code – Sibu Jan 30 '12 at 11:44
  • What else do you need? I believe the code I put in the question is the only interesting line for this problem. – gozzilli Jan 30 '12 at 11:51
  • i guess you may have left some tags open..maybe – Sibu Jan 30 '12 at 11:53
  • Looks like it might be a firefox issue more then a code issue, the syntax above is fine. Do you have a list of installed plugins? – Anicho Jan 30 '12 at 11:55
  • Edited the question with the requested list of plugins – gozzilli Jan 30 '12 at 12:04
  • Maybe you have some unclosed tag or some other HTMLmistake. Could you paste your HTML? Or you can try to validate it: http://validator.w3.org/ – Waiting for Dev... Jan 30 '12 at 12:15
  • 1
    Disable adblock Element Hiding Helper for Adblock Plus 1.2.1 & Adblock Plus! and try then – Anicho Jan 30 '12 at 12:39
  • @cram1010 I believe there shouldn't be any HTML mistake. A quick validation with the w3.org tool returns errors just because it doesn't like django template tags, which is to be expected. Apart from that, it doesn't complain for HTML typos. – gozzilli Jan 30 '12 at 14:40
  • @Anicho Tried disabling the two addons, but didn't make any difference. Joeri Hendrickx's answer below might have put me on the right track. – gozzilli Jan 30 '12 at 14:41

3 Answers3

1

For anyone that comes across this and has cookie blockers or similar installed.

I had this issue just now as well, but it turned out it was Privacy Badger that was disallowing Trip Advisor to load it's images, by disabling Trip Advisor cookies. However, there is not much you can do to stop this repeating itself on other people's computers if they have privacy software enabled.

Here's two screenshots of before and after.

Trip Advisor logos not visible, due to cookie blocker

Trip Advisor logos visible, after cookies were allowed

Mark Conroy
  • 689
  • 7
  • 11
1

Does the site you refer to allow remote linking? Some sites disallow this by checking the referrer header. It's entirely possible that firebug is not using the referrer at all, but firefox will do it when loading your page.

In the firebug net tab, you should be able to see the request for the image. Check the response for that. Is it a 200 (http ok)? if so, is the data that is sent correct, or is it blank?

Joeri Hendrickx
  • 16,947
  • 4
  • 41
  • 53
  • Many thanks for your reply. I checked the HTTP response and indeed it's a 403 Forbidden. But why doesn't this happen with Chrome too? – gozzilli Jan 30 '12 at 14:13
  • That can depend on lots of things. For all we know, the server could even block firefox specifically. It could be caused by a cookie, too. Who's hosting the image? One thing you could do is compare the headers that are sent along from firefox (in firebug) with the ones that are sent by chrome (in developer tools). – Joeri Hendrickx Jan 30 '12 at 14:36
  • I edited the question with the request headers from Firefox and Chromium. I don't see much difference. The website is `ia.media-imdb.com` – gozzilli Jan 30 '12 at 14:55
  • I was gonna recommend using fiddler or firebug next, well done Joeri +1 – Anicho Jan 30 '12 at 15:57
  • hmm. The headers show nothing unorthodox. I guess the referrer could be an issue, being localhost on one, and 127.0.0.1 on the other (though they should resolve to the same, ...). You could try manipulating the headers (with the modify headers plugin) to check if you can make it work that way. At this point, I should also note that if imdb is trying to prevent you from linking to their resources, maybe you shouldn't do it. – Joeri Hendrickx Jan 30 '12 at 16:13
0

This is because the option "Load images automatically" is disabled in your Firefox (option dialog, "Content" panel), in such a case Firefox will only load images with local paths, not remote images.

https://support.mozilla.org/en-US/kb/fix-problems-images-not-show#w_check-image-permissions

Christophe Franco
  • 1
  • 1