Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

I am using simple html tag to display images from imgur.com:

<img alt="Modern Dashboard Design" src="http://i.imgur.com/yst7lV9.png?1" style="height:550px; width:1024px" />
this was working few days back, but now it is not showing. Image is displaying on jsfiddle,but not displaying on this page:
http://www.ucom.my/p/admin-page-for-website-50
When you view the page source, you will find img tags.
What might be the reason?
                Most likely cross domain requests are blocked. That is pretty much standard today. If that is the cause, then you need to set a header granting requests to that domain.
– arkascha
                Nov 8, 2016 at 14:35
                Refused to load the image 'i.imgur.com/2qEeCDA.png' because it violates the following Content Security Policy directive: "default-src 'self'". Note that 'img-src' was not explicitly set, so 'default-src' is used as a fallback.
– user5306470
                Nov 8, 2016 at 14:37
Content Security Policy: The page’s settings blocked the loading of a resource at http://i.imgur.com/2qEeCDA.png (“default-src http://www.ucom.my”).
Content Security Policy: The page’s settings blocked the loading of a resource at http://i.imgur.com/yst7lV9.png?1 (“default-src http://www.ucom.my”).
Content Security Policy: The page’s settings blocked the loading of a resource at http://i.imgur.com/GAXEkpu.jpg (“default-src http://www.ucom.my”).
Content Security Policy: The page’s settings blocked the loading of a resource at self (“default-src http://www.ucom.my”).
This can be seen when opening the Firebug console.
You have this in your head:
<meta http-equiv="Content-Security-Policy" content="default-src 'self'">
This means you have deliberately blocked all requests to imgur or anywhere else. Change it to this:
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; img-src example.com;">
Or just remove it entirely.
  
Refused to load the image 'http://i.imgur.com/GAXEkpu.jpg' because it
  violates the following Content Security Policy directive: "default-src
  'self'". Note that 'img-src' was not explicitly set, so 'default-src'
  is used as a fallback.
And this happens because:
<meta http-equiv="Content-Security-Policy" content="default-src 'self'">
this line of code exists which disallows content from foreign sources.
  
Refused to load the image 'http://i.imgur.com/GAXEkpu.jpg' because it violates the following Content Security Policy directive: "default-src 'self'". Note that 'img-src' was not explicitly set, so 'default-src' is used as a fallback.
You've included:
  <meta http-equiv="Content-Security-Policy" content="default-src 'self'">
in your page, which bans the use of <img> elements with a src on a different domain.
It says: 

[Error] Refused to load http://i.imgur.com/2qEeCDA.png because it appears in neither the img-src directive nor the default-src directive of the Content Security Policy.
[Error] Refused to apply a stylesheet because its hash, its nonce, or 'unsafe-inline' appears in neither the style-src directive nor the default-src directive of the Content Security Policy. (admin-page-for-website-50, line 87)
[Error] Refused to load http://i.imgur.com/yst7lV9.png?1 because it appears in neither the img-src directive nor the default-src directive of the Content Security Policy.
[Error] Refused to apply a stylesheet because its hash, its nonce, or 'unsafe-inline' appears in neither the style-src directive nor the default-src directive of the Content Security Policy. (admin-page-for-website-50, line 89)
[Error] Refused to load http://i.imgur.com/GAXEkpu.jpg because it appears in neither the img-src directive nor the default-src directive of the Content Security Policy.
        
Thanks for contributing an answer to Stack Overflow!
Please be sure to answer the question. Provide details and share your research!
But avoid …
Asking for help, clarification, or responding to other answers.
Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.