40

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?

1
  • 2
    Check your AdBlock! :)
    – FooBar
    Mar 6, 2018 at 14:39

8 Answers 8

88

just disable adblock, it works for me

6
  • 4
    Hey, simple an best answer =) May 24, 2019 at 17:02
  • 1
    Really is The Adblock chrome extensions blocks it, thanks.
    – V-SHY
    Oct 1, 2019 at 14:17
  • 1
    In firefox, you'll need to disable facebook container and tracking protection
    – roadev
    Apr 19, 2021 at 16:03
  • Does this mean facebook login won't work if people have adblock enabled?
    – workwise
    Apr 16, 2022 at 12:59
  • @workwise it was true few years ago, idk about current siatuation, but it is possible to be an true.
    – yawa yawa
    Apr 17, 2022 at 13:04
41

There were a couple things wrong here:

  1. needed to change js.src assignment to: js.src="https://connect.facebook.net/en_US/all.js";

  2. 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.

5
  • 2
    IN explanation to pointer 2. This is because the js.src in init code is protocol relative. so if you are accessing a local file. it will try to access fb sdk over file: and the error
    – Mukul Goel
    Nov 7, 2014 at 9:29
  • Yes, I found that I can test it on a local web server (e.g. WAMP) if I access the file as, e.g., localhost/FacebookApp instead of file://c:\wamp\www\FacebookApp\index.html.
    – sigil
    Nov 7, 2014 at 18:31
  • 1
    Yes. That is because your js.src might be pointing to "//connect.facebok.... it is protocol relative. therefore. if you are accessing ur page locally without server i.e. using a file:// , so facebook init tries to load the javascript sdk from file://connect.facebook.net.... which is not going to happen. So it does not work. Also.. it is best to have js.src point to //connect.facebook.net/en_US/all.js so that even http requests are handled. Anyway.. I learned it today, So thought to share.
    – Mukul Goel
    Nov 7, 2014 at 19:27
  • 1
    I had the same problem. But now when it should show the login form I get this error message: "Can't Load URL: The domain of this URL isn't included in the app's domains. To be able to load this URL, add all domains and subdomains of your app to the App Domains field in your app settings. " Any idea on how to resolve that. I have the correct URL's in there. Thanks in advance. Sep 7, 2016 at 11:18
  • 1
    Remember to check your adblock! ;)
    – FooBar
    Mar 7, 2018 at 12:57
6

First you need to append http or https to js.src url

Second you need to host you html file on a server.

4

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

0

Go To Facebook developer and add your website domain and get the id and paste below:

 appId : 'my app ID', // App ID from the App Dashboard
0

Adding one more thing I didn't see here: if you are debugging in Firefox, disable Enhanced Tracking Protection and Facebook Container while you are developing.

0

just disable any kind of ad blocker extention you have use then it will be working fine.

2
0

Worth to check any kind of ad blocker extension. The error net::ERR_BLOCKED_BY_CLIENT is exactly about it.

There are several solutions you can try to fix this error:

  • Solution 1: Disable extensions
  • Solution 2: Whitelist the domain
  • Solution 3: Debug the issue
  • Solution 4: Clear browser cache and cookies#
  • Solution 5: Disable antivirus software
  • Solution 6: Use Incognito mode

Here is a full article about it: https://www.keycdn.com/support/how-to-solve-err-blocked-by-client

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.