La boîte de dialog FB.login ne se ferme pas sur Google Chrome

FB.login() sur un événement de clic dans mon application. La boîte de dialog apparaît comme prévu, mais lorsque l’utilisateur a fini de se connecter à Facebook (et / ou d’autoriser l’application), la boîte de dialog ne se ferme pas. Au lieu de cela, il charge une page blanche (dans la boîte de dialog) et le titre est remplacé par XD Proxy .

Cela se produit uniquement sur Google Chrome (j’utilise la dernière version disponible actuellement pour Windows 7).

Cela ne se produit pas si Chrome est en mode navigation privée.

Le plugin social ‘fb-login’ fonctionne bien sur Chrome.

Pour tester / déboguer cela plus loin, j’ai créé une nouvelle application Facebook avec des parameters vanilla. Le seul changement que j’ai apporté a été de définir l’URL du site dans les parameters de l’application. Voici le code HTML que vous pouvez utiliser pour recréer ce bogue.

Exemple de code pour recréer un problème

     Chrome Bug Test    
FB.init({ appId : '[YOUR APP ID HERE]', status : true, // check login status cookie : true, // enable cookies to allow the server to access the session xfbml : true // parse XFBML }); function dologin(){ FB.login(function(r){ if(console && console.log) { console.log(r); } }); }

Paramètres Facebook que j’ai essayé de changer

  1. La définition d’un domaine de site n’a rien changé.
  2. L’utilisation d’un channelUrl et d’un fichier de canal personnalisés n’a pas aidé non plus.

Bugs liés suivis sur Facebook

  • http://bugs.developers.facebook.net/show_bug.cgi?id=14789
  • https://github.com/facebook/connect-js/issues/269
  • http://bugs.developers.facebook.net/show_bug.cgi?id=12112
  • http://developers.facebook.com/bugs/278247488872084

Problèmes connexes sur le dépassement de stack

  • Popup vide avec FB connect
  • facebook connecter vide pop up sur chrome
  • Facebook Connect Login redirigeant dans Chrome et Safari
  • https://stackoverflow.com/questions/4423718/blank-page-with-fb-connect-js-sdk-on-after-permission-request
  • Facebook connect montrant un popup vierge lors de la connexion à Internet Explorer 8
  • La fenêtre contextuelle de connexion Facebook rest ouverte lors de l’utilisation de Fb.login dans IE
  • JS SDK FB.login () fonctionne mais la boîte de dialog contextuelle rest ouverte après la connexion
  • Connexion Facebook bloquée sur “XD Proxy” lorsque la page est installée via Chrome Web Store
  • XD Proxy Facebook
  • XD_Proxy popup ne se ferme pas

J’ai vu beaucoup de personnes rencontrer cela, mais ce qui m’embête, c’est que je n’ai pas pu trouver de solution concrète à cela. Facebook n’a pas encore répondu aux rapports de bogues. Une solution consisterait à se débarrasser du code d’authentification basé sur Javascript et à le faire uniquement à l’aide du mécanisme de serveur (Facebook PHP SDK). Je voudrais éviter cela en raison des contraintes de temps.

Quelqu’un at-il des idées sur la façon de résoudre ce problème?

J’ai reçu un appel similaire à FB.login() pour fermer la boîte de dialog en changeant

 onclick="dologin()" 

à

 onclick="dologin(); return false;" 

Étant donné l’âge de cet article, je suppose que l’affiche a résolu ce problème; Cependant, étant donné qu’il s’agit également d’une ressource pour les personnes cherchant à résoudre des problèmes similaires, j’ai pensé inclure mon expérience au cas où.

J’ai découvert que ce qui provoquait pour moi le même problème de problème était d’oublier accidentellement d’inclure event.preventDefault(); dans mon gestionnaire d’écoute “click” dans jQuery. La boîte de dialog de connexion à Facebook s’est ouverte et m’a permis de me connecter, mais pas de disparaître. Le problème était que le site Web exécutait l’action de publication de formulaire par défaut, qui interférait avec la fonction de rappel de Facebook.

J’ai eu le même problème exact. J’ai fait deux choses, d’abord j’ai ajouté cette ligne juste avant l’appel FB.init() :

 FB.Flash.hasMinVersion = function () { return false; }; 

Ensuite, je suis allé sur la page de l’application FB et j’ai ajouté le domaine du site (c.-à-d. Test.com).

Je pense que le paramètre de domaine du site était la clé, mais je ne suis pas 100% positif. Tout ce que je sais, c’est qu’il semble toujours se fermer maintenant dans tous les navigateurs, y compris Chrome.

Réponse courte concernant la question ci-dessus:

Chargez le script all.js sur https .

  

Réponse plus longue si vous dépannez un problème similaire à la question initiale:

Utilisez Google Chrome pour tenter la connexion. Une fois que vous vous êtes connecté et que la fenêtre contextuelle vide apparaît à l’écran, appuyez sur F12 . Cela fait apparaître les outils de développement pour Chrome. Cliquez sur l’onglet Console et vous verrez l’erreur. Ce que vous verrez probablement est lié aux problèmes XD (cross-domain).

Même si votre problème particulier est différent de celui que je rencontrais, cela devrait vous conduire dans la bonne direction.

Mon problème / solution était spécifique à la documentation de Facebook C # SDK v6 – le code du tutoriel charge le script all.js en utilisant une URL qui commence par // – qui charge ensuite le script à partir du même schéma que mon site (qui était http). Après m’être connecté, la fenêtre contextuelle a tenté de me redirect depuis la connexion https Facebook vers mon site http et mon bingo, nous avons le problème XD. La solution consistait à charger spécifiquement les scripts depuis https://connect.facebook.net/en_US/all.js comme suit:

  // 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 = "https://connect.facebook.net/en_US/all.js"; ref.parentNode.insertBefore(js, ref); }(document)); 

Modifier:

Après quelques considérations, cette approche consistant à autoriser une redirection vers http risque de compromettre la sécurité du système en permettant à une autre personne de lire les données de cette requête et de les réutiliser ensuite. Je n’ai pas pu trouver de documentation ou d’exemples pertinents et je ne pouvais donc pas conclure d’une manière ou d’une autre, YMMV.

Appeler cet extrait après FB.init résolu le problème pour moi. Mais d’autres solutions semblent avoir fonctionné pour différents cas.

 $.browser.chrome = /chrome/.test(navigator.userAgent.toLowerCase()); if ($.browser.chrome || $.browser.msie) { FB.XD._origin = window.location.protocol + "//" + document.domain + "/" + FB.guid(); FB.XD.Flash.init(); FB.XD._transport = "flash"; } else if ($.browser.opera) { FB.XD._transport = "fragment"; FB.XD.Fragment._channelUrl = window.location.protocol + "//" + window.location.host + "/"; } 

J’ai rencontré le même problème dans IE9, et cela semblait provenir de la mise à niveau vers Flash Player 10. Les réponses suggérées ne fonctionnaient pas pour moi et j’avais perdu espoir d’essayer de le réparer depuis que j’ai trouvé un bogue sur Facebook. le couvrant Mais Henson a posté une réponse sur une question similaire qui l’a corrigée pour moi. Dans le JavaScript de mon site maître j’ai supprimé ces lignes

  FB.UIServer.setLoadedNode = function (a, b) { //HACK: http://bugs.developers.facebook.net/show_bug.cgi?id=20168 FB.UIServer._loadedNodes[a.id] = b; }; 

et maintenant ça marche. (NB: je n’ai pas vérifié si la publication d’IE8 sur ces lignes visait à surmonter les retours.)