AntonAL
AntonAL

Reputation: 17400

Failed to load resource under Chrome

There is a bunch of images in a web page.

Other browsers do download them correctly, but Chrome doesn't.

In the developer's console, it shows the following message for each image:

Failed to load resource

As mentioned before, problem appears only in Chrome.

What is it?

Upvotes: 231

Views: 785534

Answers (14)

Ether Man
Ether Man

Reputation: 41

Removing the / from the path helped me to solve this problem.

See more at: Failed to load resource: net::ERR_FILE_NOT_FOUND loading json.js

Upvotes: 0

GHULAM NABI
GHULAM NABI

Reputation: 496

It is due to ad-blocker.When project files names contains words like 'ad' then ad-blockers also block theses files to load.

Best solution is that never save any files with these name keys.

Upvotes: 2

Tony Tambe
Tony Tambe

Reputation: 573

FYI - I had this issue as well and it turned out that my html listed the .jpg file with a .JPG in caps, but the file itself was lowercase .jpg. That rendered fine locally and using Codekit, but when it was pushed to the web it wouldn't load. Simply changing the file names to have a lowercase .jpg extension to match the html did the trick.

Upvotes: 3

Merlin051
Merlin051

Reputation: 301

There is a temporary work around in Reenable (temporary) showModalDialog support in Chrome (for Windows) 37+.

Basically, create a new string in the registry at

HKEY_LOCAL_MACHINE\SOFTWARE\Policies\Google\Chrome\EnableDeprecatedWebPlatformFeatures

Under the EnableDeprecatedWebPlatformFeatures key, create a string value with the name 1 and a value of ShowModalDialog_EffectiveUntil20150430. To verify that the policy is enabled, visit chrome://policy URL.

Upvotes: 3

bcolin
bcolin

Reputation: 438

If the images are generated via an ASP Response.Write(), make sure you don't call Response.Close();. Chrome doesn't like it.

Upvotes: 7

Kabir Sarin
Kabir Sarin

Reputation: 18526

I recently ran into this problem and discovered that it was caused by the "Adblock" extension (my best guess is that it's because I had the words "banner" and "ad" in the filename).

As a quick test to see if that's your problem, start Chrome in incognito mode with extensions disabled (ctrl+shift+n) and see if your page works now. Note that by default all extensions will be already disabled in incognito mode unless you've specifically set them to run (via chrome://extensions).

Upvotes: 316

Sergiu
Sergiu

Reputation: 1396

I updated my Chrome browser to the latest version and the issue was fixed.

Upvotes: 1

user669677
user669677

Reputation:

Facts:

Upvotes: 4

jmorganmartin
jmorganmartin

Reputation: 343

Kabir's solution is correct. My image URL was

/images/ads/homepage/small-banners01.png, 

and this was tripping up AdBlock. This wasn't a cross-domain issue for me, and it failed on both localhost and on the web.

I was using Chrome's network tab to debug and finding very confusing results for these specific images that failed to load. The first request would return no response (Status "(pending)"). Later down the line, there was a second request that listed the original URL and then "Redirect" as the Initiator. The redirect request headers were all for this identical short line of base64-encoded data, and each returned no response, although the status was "Successful":

GET      data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAACklEQVR4nGMAAQAABQABDQottAAAAABJRU5ErkJggg== HTTP/1.1

Later I noticed that these inline styles were added to all the image elements:

    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;

Finally, I did not receive any "failed to load resource" messages in the console, but rather this:

Port error: Could not establish connection. Receiving end does not exist.

If any of these things is happening to you, it probably has something to do with AdBlock. Turn it off and/or rename your image files.

Also, because of the inline CSS created by AdBlock, the layout of my promotions slider was being thrown off. While I was able to fix the layout issues with CSS before finding Kabir's solution, the CSS was somewhat unnecessary and affected the flexibility of the slider to handle images of multiple sizes.

I guess the lesson is: Be careful what you name your images. These images weren't malicious or annoying as much as they were alerting visitors to current promotions and specials in an unobtrusive way.

Upvotes: 10

john k
john k

Reputation: 6615

There is also the option of turning off the cache for network resources. This might be best for developing environments.

  1. Right-click chrome
  2. Go to 'inspect element'
  3. Look for the 'network' tab somewhere at the top. Click it.
  4. Check the 'disable cache' checkbox.

Upvotes: 21

user3799524
user3799524

Reputation:

In Chrome (Canary) I unchecked "Appspector" extension. That cleared the error. enter image description here

Upvotes: 2

marcostrama
marcostrama

Reputation: 161

I was getting this error, only in Chrome (last version 24.0.1312.57 m), and only if the image was larger than the html img. I was using a php script to output the image like this:

header('Content-Length: '.strlen($data));
header("Content-type: image/{$ext}");
echo base64_decode($data);

I resolved it adding 1 to the lenght of the image:

header('Content-Length: '.strlen($data) + 1);
header("Content-type: image/{$ext}");
echo base64_decode($data);

Appears that Chrome dont expect the correct number of bytes.

Tested with sucess in Chrome and IE 9. Hope this help.

Upvotes: 4

nuri
nuri

Reputation: 441

In case it helps anyone, I had this exact same problem and discovered that it was caused by the "Do Not Track Plus" Chrome Extension (version 2.0.8). When I disabled that extension, the image loaded without error.

Upvotes: 21

ismail
ismail

Reputation: 47572

Check the network tab to see if Chrome failed to download any resource file.

Upvotes: 40

Related Questions