dstroot / skeleton

Node Express MongoDB Bootstrap Passport... all rolled up into juicy goodness
skeleton-app.jit.su
MIT License
370 stars 47 forks source link

Embedded images from external sources not loading? #42

Closed xbullet closed 8 years ago

xbullet commented 8 years ago

Hi,

I am unable to see any externally hosted images using img(src=) in my views when using Google Chrome or Firefox. The images do not appear at all. If I specify a width and height, they render as an empty box. When inspecting with the network tab in Chrome, there appears to be no request made to get the image.

If I save a local copy of the page (as html) and open it, the embedded images work fine in all browsers.

Pages appear to render as I'd expect them to in Internet Explorer.

(note, this is a fresh install of skeleton with the default stylesheets and templates)

extends ../layouts/layout

block head
  title #{application} · Player Stats
block content
    .container
    .row
      .col-sm-8.col-sm-offset-2
        br
        br 
        img.img-responsive.center-block(src='https://steamcdn-a.akamaihd.net/steamcommunity/public/images/avatars/1f/1fcedb8073e4fd0d5b118d15e6b36f6cf447f737_full.jpg' width=184 height=184)   
        p Matches for #{steamJson.response.players[0].personaname} (#{steamId})...

Am I doing something wrong? :(

xbullet commented 8 years ago

OK, I've found why, it's due to Helmet and CSRF protection. I am new to both web dev and to node, so please excuse my naivety. I hadn't even considered this to be an issue before.

Is there a better way to deal with this than add the base URL to the whitelist?

Cheers