I'm trying to run the first example from the documentation of the Facebook JS SDK. I created a new app, created a blank document called "facebookTest.html", pasted in the code from the example, and plugged in the new app's App ID. Code as follows:
<html>
<head>
<title>Login with facebook</title>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
// init the FB JS SDK
FB.init({
appId : 'my app ID', // App ID from the App Dashboard
status : true, // check the login status upon init?
cookie : true, // set sessions cookies to allow your server to access the session?
xfbml : true // parse XFBML tags on this page?
});
// Additional initialization code such as adding Event Listeners goes here
};
// Load the SDK's source Asynchronously
// Note that the debug version is being actively developed and might
// contain some type checks that are overly strict.
// Please report such bugs using the bugs tool.
(function(d, debug){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = document.location.protocol+"//connect.facebook.net/en_US/all" + (debug ? "/debug" : "") + ".js";
ref.parentNode.insertBefore(js, ref);
}(document, /*debug*/ false));
</script>
When I load the page, on the Javascript console I get the following error message:
Failed to load resource
What am I doing wrong?
EDIT: When I add document.location.protocol
before the "//connect.facebook.net/..."
, as suggested here, the screen stays blank, and the console shows the following:
GET file://connect.facebook.net/en_US/all.js
Is that all this code is supposed to do? Or is it still failing?
just disable adblock, it works for me
There were a couple things wrong here:
needed to change js.src
assignment to: js.src="https://connect.facebook.net/en_US/all.js";
Facebook no longer supports JS SDK calls made from a local file, the script has to be run on a file with an http://
or https://
URI, as per this bug report on Facebook. I will need to upload the file to a web server, change the canvas URL accordingly, and retest.
First you need to append http or https to js.src url
Second you need to host you html file on a server.
If your URL contains words such as "advert", "ad", "doubleclick", "click", or something similar…
For example:
GET googleads.g.doubleclick.net/pagead/id
static.doubleclick.net/instream/ad_status.js
…Then ad-blocker will block it.
Ref : Getting "net::ERR_BLOCKED_BY_CLIENT" error on some AJAX calls
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With