Facebook登录onClick - Javascript [英] Facebook login onClick - Javascript

问题描述

我在我的网站上有这个代码。当我的页面加载时，Facebook登录对话框将显示，而当用户点击锚标签时，该对话框将显示。

 < script> 
 //其他JS函数
 window.fbAsyncInit = function（）{
 FB.init（{
 appId：'xxxxxxxxxxxxxx'，// App ID 
 channelUrl ：'//192.168.1.127/test/channel.html'，// Channel File 
 status：true，//检查登录状态
 cookie：true，//启用Cookie以允许服务器访问会话
 xfbml：true //解析XFBML 
}）; 
 
 //其他初始化代码在这里
 FB.getLoginStatus（function（response）{
 if（response.status ==='connected'）{
 //连接
} else if（response.status ==='not_authorized'）{
 // not_authorized 
 login（）; 
} else {
 // not_logged_in 
 login（）; 
} 
}）; 
}; 
 
函数login（）{
 FB.login（function（response）{
 if（response.authResponse）{
 testAPI（）; 
}否则{
 //取消
} 
}）; 
} 
 
 function testAPI（）{
 console.log（'Welcome！Fetching your information ....'）; 
 FB.api（'/ me'，function（response）{
 console.log（'Good to see you，'+ response.name +'。'）; 
}）; 
} 
 
 //异步加载SDK 
（function（d）{
 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 =//connect.facebook.net/en_US/all.js; 
 ref.parentNode.insertBefore（js，ref）; 
}（document）） ; 
< / script> 
  

我想要 FB.getLoginStatus 事件每当用户点击这个时，都要点燃：

 < a href =＃onClick =FB.getLoginStatus（） >登录< / A> 
  

但是现在正在加载，没有我做任何事情。

建议？

解决方案

确定这里有一个简单的解决方案 - 将调用包含在另一个函数中的 FB.getLoginStatus 中，并让您的按钮调用 功能。

  function doLogin（）{
 FB.getLoginStatus（function（response）{
 ... 
}; 
} 
  

然后，您可以更改按钮上的 onClick 到 doLogin（）。

Bassicaly，这里发生的是，一旦加载了Facebook SDK，它调用包含您的 FB.getLoginStatus 代码的 window.fbAsyncInit 函数，所以一旦SDK准备就绪，登录代码正在执行。

I have this code on my website. The facebook login dialog is being shown when my page has loaded and not when the user has click on an anchor tag.

<script>
  // Additional JS functions here
  window.fbAsyncInit = function() {
    FB.init({
      appId      : 'xxxxxxxxxxxxxx', // App ID
      channelUrl : '//192.168.1.127/test/channel.html', // Channel File
      status     : true, // check login status
      cookie     : true, // enable cookies to allow the server to access the session
      xfbml      : true  // parse XFBML
    });

    // Additional init code here
    FB.getLoginStatus(function(response) {
      if (response.status === 'connected') {
        // connected
      } else if (response.status === 'not_authorized') {
        // not_authorized
        login();
      } else {
        // not_logged_in
       login();
      }
    });
  };

  function login() {
    FB.login(function(response) {
      if (response.authResponse) {
        testAPI() ;
      } else {
        // cancelled
      }
    });
  }

  function testAPI() {
    console.log('Welcome!  Fetching your information.... ');
    FB.api('/me', function(response) {
      console.log('Good to see you, ' + response.name + '.');
    });
  }

  // Load the SDK Asynchronously
  (function(d){
    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 = "//connect.facebook.net/en_US/all.js";
      ref.parentNode.insertBefore(js, ref);
  }(document));
</script>

I want the FB.getLoginStatus event to be fired up whenever the user click on this:

<a href = "#" onClick = "FB.getLoginStatus()">Login</a>

But right now it's being loaded without me doing anythings.

Suggestions?

解决方案

Ok so there is a simple solution here - wrap the call to FB.getLoginStatus in another function and have your button call that function.

function doLogin(){
  FB.getLoginStatus(function(response) {
    ...
  };
}

Then you can change the onClick on your button to doLogin().

Bassicaly, what was happening here is that as soon as the Facebook SDK is loaded, it calls the window.fbAsyncInit function which contained your FB.getLoginStatus code, so as soon as the SDK was ready, the login code was being executed.

这篇关于Facebook登录onClick - Javascript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！