2

To process image load error I used to write something like this:

<img src="image.png" onError="this.src='defaultImage.png';"/>

but since I've added content-security-policy to my app, inline-scripts doesn't work anymore.
Are there any other solutions for this problem?

kitos
  • 103
  • 6
  • Is it specifically in-line scripts that don't work ? Could you attach the onError event using javascript afte rthe page has loaded ? – user2808054 Apr 01 '15 at 09:13
  • It's not so good solution because a lot of markup is generated by js, so it will not be handled on DOMContentLoaded event. – kitos Apr 01 '15 at 09:19
  • I see - although .. could you add it after the event which generates the markup? – user2808054 Apr 01 '15 at 09:34
  • Certainly I can, but I have a lot of such places and I don't want to call some code each time I generate the markup. Solution should be more generic. – kitos Apr 01 '15 at 09:42

1 Answers1

1

There is no reliable way to replace broken images in the browser, even the onerror attribute doesn't work in all major browsers (compatibility table).

The proper and safe solution is to serve all images through a reverse-proxy, and configure it to send back a default image when the upstream request fails.

Related question: jQuery/JavaScript to replace broken images.

Changaco
  • 790
  • 5
  • 12