Facebook like button error - blocked frame

Question

I'm using jQuery to create dynamic Facebook "Like" buttons. However I'm getting an error that's just repeating itself over and over again.

My jQuery to create the button is:

$('#fbLike').html('<fb:like href="'+url+'" send="false" layout="button_count" width="80" show_faces="true" />');
FB.XFBML.parse(document.getElementById('fbLike'));

However, I'm getting the following error:

Blocked a frame with origin "https://www.facebook.com" from accessing
a frame with origin "http://localhost:8888".  The frame requesting
access has a protocol of "https", the frame being accessed has a
protocol of "http". Protocols must match.

Any ideas?

• Edit

  (function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/en_US/all.js#xfbml=1"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));

Answer 1

This happens because protocols does not match.

You are trying to create a https frame in http page.

Because of mixed content is disabled on your browser you are seeing that error.

You can enable mixed content on google chrome via command line arg.

chrome.exe --allow-running-insecure-content