web-dev-qa-db-fra.com

bloc popup de connexion fb

Je fais en utilisant la fonction de connexion fb mais le problème qui vient à moi est que chaque fois que je clique sur le bouton de connexion fb avant que le chargement du support de la page soit terminé, il bloque la fenêtre contextuelle pour la connexion fb mais si je clique sur fblogin après une seconde passée à l'événement de chargement, il travaux

Voici la fonction que j'utilise:

function fb_login() {
var email='';
console.log(loginClassbackQueue);
// console.log('user wants to login with fb');
FB.getLoginStatus(function(response) {
    if(response.status!='connected'){
        FB.login(function(response) {
            // console.log(response);
            if (response.authResponse) {
                // console.log('user logged in successfully');
                // console.log(response);
                email = update_f_data_login(response);
                $('#fb_login_popup, #popup_overlay').hide();
                // loginme(email);
                } 
            else {
                    loginClassbackQueue = [];
                // console.log('user failed to login');
                }
                // console.log('fb login completed successfully');
            }, {scope:"email,user_birthday,user_likes,user_location,friends_likes,publish_actions"}
        );
        }
    else{
    // console.log('logged in and connected');
    email = update_f_data_login(response);
    $('#fb_login_popup, #popup_overlay').hide();
    }

});

}

La même action lorsque je le fais sur ce site http://fab.com/ il ouvre toujours des popups ne bloquent jamais un popup.

javascriptjqueryfacebookfbmlfbconnect
30
Rohit Agrawal

Vous ne pouvez pas appeler FB.login À partir du rappel de FB.getLoginStatus.

Les navigateurs ont tendance à bloquer les fenêtres contextuelles de la fenêtre contextuelle qui n'est pas générée comme résultat immédiat de l'action de clic d'un utilisateur.

Étant donné que FB.getLoginStatus Effectue un appel ajax et que vous appelez FB.login Sur sa réponse, la fenêtre contextuelle qui s'ouvrira à la suite de cet appel est bloquée.

Une solution à votre problème serait d'appeler FB.getLoginStatus Au chargement de la page et d'utiliser la réponse à l'intérieur de votre méthode fb_login().

55
Fisch

Il est tout à fait correct d'appeler FB.login À partir du rappel de FB.getLoginStatus, Tant que vous êtes sûr que l'état de connexion a déjà chargé en interne. Pour ce faire, utilisez l'un d'eux:

  • FB.init({..., status: true, ... }).
  • FB.getLoginStatus(...)
  • FB.login(...)
  • FB.ui(...)

Techniquement, toutes ces options utilisent FB.ui. Le processus asynchrone doit se terminer, ce qui pourrait prendre quelques secondes. Tant que vous avez déjà utilisé l'une des méthodes ci-dessus pour effectuer un appel interdomaine avec FB et que ce processus asynchrone est terminé, l'obtention du statut de connexion ne fera pas d'appel asynchrone et la fenêtre contextuelle ne sera pas bloquée.

Vous devez également vous assurer not pour spécifier true pour le deuxième paramètre, comme dans FB.getLoginStatus(..., true);.

40
AndrewF

Assurez-vous de définir status sur true , cela résoudra le problème du bloqueur de fenêtres contextuelles.

window.fbAsyncInit = function() {
  FB.init({
    appId      : '{your-app-id}',
    cookie     : true,  // enable cookies to allow the server to access 
                        // the session
    xfbml      : true,  // parse social plugins on this page
    version    : 'v2.5', // use graph api version 2.5
    status     : true // set this status to true, this will fixed popup blocker issue
  });
12
Rusly - Mices

J'ai eu le même problème et ça m'a donné un coup de pied pendant 3 jours. Je suis tombé sur les solutions mentionnées ci-dessus et elles fonctionnaient dans Firefox et Edge mais dans Chrome peu importe ce que je faisais, je restais toujours bloqué à gauche et au centre. L'autre problème était quand j'ai appelé le fonctionne à partir d'un événement de pression de bouton, la boîte de dialogue de connexion n'était pas bloquée, mais elle n'a reçu aucune réponse après la fermeture de la boîte de dialogue de connexion pour d'autres actions, donc je suis coincé. Ma solution est la suivante, mais vous n'avez pas besoin d'appuyer sur la connexion dans le bouton, il sera redirigé vers la page de connexion FB sans événement de pression de bouton, et au retour, continuez avec toutes les autres étapes sdk. Ajoutez simplement cela à votre code et voyez si cela aide, à partir de là, ajustez en fonction de vos besoins

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.
                document.getElementById('Image2').style.display = "none";
                document.getElementById('mail').style.display = "in-line";

                testAPI();
            } else {
                // The person is not logged into your app or we are unable to tell.
                window.alert("Faça login no facebook antes de continuar - Obrigado");
                window.location.href = 'https://www.facebook.com/dialog/oauth' +
                '?client_id=55215442252214521548' +
                '&scope=public_profile,email,user_friends' +
                '&redirect_uri=' + encodeURIComponent(document.URL);
                document.getElementById('Image2').style.visibility = "hidden";
                document.getElementById('mail').style.display = "in-line";

            }
        }

        // 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);

            });
        }
0
Marcos J.D Junior