0

我已经尝试了 fowling 代码

https://developers.facebook.com/blog/post/2011/07/21/updated-javascript-sdk-and-oauth-2-0-roadmap/

它现在可以进行身份​​验证，我想在页面加载后自动弹出，而不是让人们再次单击按钮

我编辑并能够触发自动弹出窗口，但这只有在我保留按钮时才有效 我怎样才能删除按钮并让它仍然工作？

这就是我所做的：

<!DOCTYPE html> 
<html xmlns:fb="https://www.facebook.com/2008/fbml">
  <head> 
    <title> 
      New JavaScript SDK
    </title> 
  </head> 
<body> 

<div id="fb-root"></div>
<h2>Updated JS SDK example</h2><br />
<div id="user-info"></div>
<p><button id="fb-auth">Login</button></p>

<script>
window.fbAsyncInit = function() {
  FB.init({ appId: 'xxx', 
        status: true, 
        cookie: true,
        xfbml: true,
        oauth: true});

  function updateButton(response) {
    var button = document.getElementById('fb-auth');

    if (response.authResponse) {
      //user is already logged in and connected
      var userInfo = document.getElementById('user-info');
      FB.api('/me', function(response) {
        userInfo.innerHTML = '<img src="https://graph.facebook.com/' 
      + response.id + '/picture">' + response.name;
        button.innerHTML = 'Logout';
      });
      button.onclick = function() {
        FB.logout(function(response) {
          var userInfo = document.getElementById('user-info');
          userInfo.innerHTML="";
    });
      };
    } else {
      //user is not connected to your app or logged out
      //button.innerHTML = 'Login';
     // button.onclick = function() {
      FB.login(function(response) {
      if (response.authResponse) {
            FB.api('/me', function(response) {
          var userInfo = document.getElementById('user-info');
          userInfo.innerHTML = 
                '<img src="https://graph.facebook.com/' 
            + response.id + '/picture" style="margin-right:5px"/>' 
            + response.name;
        });    
          } else {
            //user cancelled login or did not grant authorization
          }
        }, {scope:'email'});    
     }
     //}
  }

  // run once with current status and whenever the status changes
  FB.getLoginStatus(updateButton);
  FB.Event.subscribe('auth.statusChange', updateButton);    
};

(function() {
  var e = document.createElement('script'); e.async = true;
  e.src = document.location.protocol 
    + '//connect.facebook.net/en_US/all.js';
  document.getElementById('fb-root').appendChild(e);
}());

</script>
</body> 
</html>
4

2 回答 2

1 
<script>
(function() {
  var e = document.createElement('script'); e.async = true;
  e.src = document.location.protocol 
    + '//connect.facebook.net/en_US/all.js';
  document.getElementById('fb-root').appendChild(e);
}());


window.fbAsyncInit = function() {
  FB.init({ appId: 'xxx', 
    status: true, 
    cookie: true,
    xfbml: true,
    oauth: true});
fbLoginStatus();
});
function fbLoginStatus()
{
    FB.getLoginStatus(function(response) {
        console.log(response);
        if (response.status === 'connected') {
            access_token =   FB.getAuthResponse()['accessToken'];
                         myinfo();
        } else {
            fblogin();
        }
    });
}

function fblogin()
{
FB.login(function(response) {
    if (response.authResponse) {
        console.log(response);
         access_token =   FB.getAuthResponse()['accessToken'];
                     myinfo();

    } else {
        console.log('User cancelled login or did not fully authorize.');
    }
}, {scope: 'email'});
}
function myinfo()
{
 FB.api('/me', function(response) {
                userid = response.id ;
                alert(userid);
                user_name = response.name;
                alert(user_name);
            });
}
</script>

试试这个代码，它会完全按照你想要的方式工作。

于 2013-04-12T10:43:27.130 回答
0

这是代码。我认为上面的代码也应该可以工作。

<script>
window.fbAsyncInit = function(){
    FB.init({ 
        appId: '1486670758257443', 
        status: true, 
        cookie: true,
        xfbml: true,
        oauth: true,
        version    : 'v2.1'
    });
    fbLoginStatus();
};

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


function fbLoginStatus(){
    FB.getLoginStatus(function(response) {
        console.log(response);
        if (response.status === 'connected') {
            var access_token =   FB.getAuthResponse()['accessToken'];
            console.log(access_token);
        } else {
            fblogin();
        }
    });
}

function fblogin(){
    FB.login(function(response) {
        if (response.authResponse) {
            var access_token =   FB.getAuthResponse()['accessToken'];
            console.log(access_token);
        } else {
            console.log('Authorization failed.');
        }
    },{ //permissions
        scope: 'email'
    });
}
</script>

还有一件事要提的是，根据facebook doc，弹出窗口应该通过点击事件打开。这就是他们所说的。

调用 FB.login 会导致 JS SDK 尝试打开一个弹出窗口。因此，该方法只能在用户点击事件后调用，否则弹出窗口将被大多数浏览器阻止。

于 2014-10-30T09:23:28.057 回答