How to load facebook sdk asynchronous

2019-08-11 14:43发布

问题:

I am using the following code to share in facebook.

<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
  FB.init({
  appId                : "1549906631990069",
  status               : true, 
  cookie               : true, 
  xfbml                : true, 

  oauth: true,
  frictionlessRequests : true
});
};

(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";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

</script>

After that I have one image on clicking that Image the facebook share popup is coming.

<script type="text/javascript">
function shareOnFacebook() {
    var $temp = $(".wpProQuiz_points").find("span");
                    var scored = $temp.eq(2).text();

  FB.ui(
  {
    method        : 'feed',
    display       : 'iframe',
    name          : 'I have Scored '+ scored + ' in edumongoose quiz.',
    link          : 'https://quiz.dev.edumongoose.com'
  },
  function(response) {
    if (response && response.post_id) {
      alert('OK! User has published on Facebook.');

    } else {
      alert('Post was not published.');
    }
  }
);

}

the work good in chrome and firefox normal window, But when I goes in private window it show in error : The resource at "https://connect.facebook.net/en_US/all.js" was blocked because tracking protection is enabled.

what wrong am I doing ?

回答1:

This isn't your fault! The browser is checking all downloaded script files against a list of scripts known to send tracking information back to the server. In incognito or in private mode, browsers tend to block these scripts for privacy reasons.

A bug report has been raised against Firefox at https://bugzilla.mozilla.org/show_bug.cgi?id=1226498



回答2:

The only way I success was using

    <script src=\"/js/jquery.min.js\" async></script>

then:

    <script>
     $(document).ready(function () {
     var options = {
     type: "delay",   
     time:1000, //1 sec
     scripts: [
                    "http://connect.facebook.net/en_US/all.js#xfbml=1&appI$
                    "http://assets.pinterest.com/js/pinit.js"
                            ],
     success: function () {
         FB.init({ status: true, cookie: true, xfbml: true });
     }
    };
    $.lazyscript(options);

   });
   </script>

You can seek for lazyscript on Google and download it.