注销后删除 Facebook 登录按钮 SDK

Remove Facebook Login Button SDK after a logout

我的站点同时使用 PHP SDK 生成登录按钮 Javascript SDK 生成注销按钮。这是因为我需要在服务器端登录按钮,所以它需要重定向到其他位置。

注销按钮需要在应用程序端,因为服务器无法获取之前创建的会话。

当没有人登录站点时,PHP 登录按钮应该出现,而 Javascript 登录按钮应该使用 jquery empty() 函数消失。

大多数时候,该解决方案有效,但显然存在未删除 Javascript 按钮的竞争条件,我无法找出原因。

// This is called with the results from from FB.getLoginStatus().
            function statusChangeCallback(response) {
                console.log('statusChangeCallback');
                console.log(response);
                // The response object is returned with a status field that lets the
                // app know the current login status of the person.
                // Full docs on the response object can be found in the documentation
                // for FB.getLoginStatus().
                if (response.status === 'connected') {
                    // Logged into your app and Facebook.
                    testAPI();
                } else if (response.status === 'not_authorized') {
                    // The person is logged into Facebook, but not your app.
                        $(\".fb-login-button\").empty();
                } else {
                    // The person is not logged into Facebook, so we're not sure if
                    // they are logged into this app or not.
                    $(\".fb-login-button\").empty();
                }
            }

            // This function is called when someone finishes with the Login
            // Button.  See the onlogin handler attached to it in the sample
            // code below.
            function checkLoginState() {
                FB.getLoginStatus(function(response) {
                    statusChangeCallback(response);
                });
            }

            window.fbAsyncInit = function() {
                FB.init({
                appId      : '".FB_APP_ID."',
                xfbml      : true,
                version    : 'v2.2'
                });

                FB.Event.subscribe(\"auth.logout\", function() {
                    $(\".fb-login-button\").empty();
                    $(\"#facebook-message\").empty();
                });

下面是按钮标签:

<div class="fb-login-button" data-max-rows="1" data-size="xlarge"  data-show-faces="false" data-auto-logout-link="true"></div>   

如上所述,我在没有授权和注销后调用 $(".fb-login-button").empty() 。

但是由于竞争条件,这并不总是删除按钮。有什么想法可以将 empty() 函数放在哪里来避免竞争条件?

问候

我创建了调用 FB.logout():

的注销按钮
<button id="facebook-logout-button" onclick="FB.logout();" >Facebook logout</button>

然后替换

$(\".fb-login-button\").empty();

$("#facebook-logout-button").remove();