Question

好的facebook的教程到处都有，有没有人知道我可以找到创建登录框的教程的地方。

我有一个登录按钮，我从facebook社交插件页面获得，但我不知道如何自定义它。

但我现在想知道的是如何创建一个登录框，当用户点击facebook登录按钮时，该按钮消失并显示一个包含他们的个人资料图片名称和我的活动的框。

例如，看看WETPAINT.COM，他们就是我所说的。

Answer 1

以下代码为您提供了一个登录按钮。此按钮的行为为docs：

“如果用户到达您的站点登出Facebook，该按钮将显示登录。当用户点击它时，系统将提示她输入她的Facebook用户名和密码。

如果她尚未注册您的网站，她将被重定向到您在 registration-url 参数中指定的网址。

如果她已经为您的网站注册，该按钮将触发onlogin（）Javascript事件。当此事件被触发时，您应该将用户登录到您的站点。

如果用户登录Facebook但尚未注册您的网站，该按钮会显示注册并点击该按钮会将用户带到 registration-url 。

本文档页面值得一看。

<?php

<!DOCTYPE html>

<html lang="en-US">
 <head>
 </head>
 <body>
    <div id="fb-root"></div>
        <script type="text/javascript">
            (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#xfbml=1";
              fjs.parentNode.insertBefore(js, fjs);
            }(document, 'script', 'facebook-jssdk'));

            window.fbAsyncInit = function() {
                FB.init({
                  appId      : 'YOUR APP ID', 
                  channelUrl : 'YOUR CHANNEL URL', 
                  status     : true, 
                  cookie     : true, 
                  oauth      : true, 
                  xfbml      : true  
                });
                FB.Event.subscribe('auth.login', function(response) {
                    window.location.reload();
                });
                FB.Event.subscribe('auth.logout',    function(response) {
                  window.location.reload();
                });
              };
            </script>

        <fb:login-button
           registration-url="...PATH/TO/THE/PAGE/FOR/REGISTERED/USERS.php" 
           on-login="console.log(arguments)"
        />
</body>

如何创建Facebook登录框？

1 个答案: