Facebook Like button breaks SSL because of the image-sprite loaded

Question

We use the Facebook like button on the bottom of each page. We used to have the iFrame version but now changed to the FB version. On both solutions, we get an SSL error on our page because the image file is not loaded over a secure page.

When looking into the resources loaded, we see that two files are loaded securely:

• https://www.facebook.com/plugins/like.php?app_id=110658975693059&href=http%3A%2F%2Fwww.stackoverflow.com&send=false&layout=button_count&width=280&show_faces=false&action=like&colorscheme=dark&font&height=21
• https://s-static.ak.facebook.com/rsrc.php/v1/yK/r/PpEvPTmpg44.js

and the image sprite is loaded in plain http:

• http://static.ak.fbcdn.net/rsrc.php/v1/z7/r/ql9vukDCc4R.png

I guess it is a temporary bug from facebook because the ssl-loaded css file references to a non-ssl image file. I created a bug report some time ago - with no response yet. Does any one have the same problem or even a solution on how to deal with that?

Thanks

Answer 1

There really is no fix for this that you can do on your end. Facebook must fix this, and they are extremely slow at fixing bugs. I noticed this on my site as well. Facebook's https css file is referencing non https images and causing this. I think this is a newer issue though because it used to work fine on my site.

Answer 2

We ended up grabbing the button resources and storing them locally. This improves page load time and solves any possible HTTPS issues.