web-dev-qa-db-fra.com

Facebook affiche l'erreur "tentative de JavaScript non sécurisée pour accéder au cadre avec l'URL" dans Chrome

Mon exemple d'application Facebook fonctionnait très bien hier dans Chrome. La page intègre Silverlight et Facebook via le SDK JavaScript. Je peux vérifier l'état de connexion de base, vous connecter à Facebook, obtenir votre nom et vous déconnecter.

Aujourd'hui, sans aucun changement de ma part, il est cassé en Chrome avec une erreur JavaScript très courante dans les résultats de recherche Google, mais pas de vraies réponses. Cela fonctionne toujours très bien dans IE et Firefox.

Voici l'URL publique:

http://www.andrewdothay.net/prj/facebook/

Lorsque vous ouvrez la console JavaScript dans Chrome, elle génère des tonnes de ces erreurs:

Tentative JavaScript non sécurisée d'accéder au cadre avec l'URL

http://www.facebook.com/login.php?api_key=151352704876752&cancel_url=http%3A%2F%2Fstatic.ak.fbcdn.net%2Fconnect%2Fxd_proxy.php%23cb%3Df1175dd3f%26Ohttp% 253A% 252F% 252Fwww.andrewdothay.net% 252Ff304d89d8% 26relation% 3Dopener% 26transport% 3Dpostmessage% 26frame% 3Df3760623c% 26result% 3DxxRESULTTOKENxx & channel_url = http% 3A% 2F% 2Fwww% 2Fwww & f en_US & method = auth.login & next = http% 3A% 2F% 2Fstatic.ak.fbcdn.net% 2Fconnect% 2Fxd_proxy.php% 23cb% 3Df3c546942% 26Origin% 3Dhttp% 253A% 252F% 252Fwww.andrewdothay30d89% 263 26transport% 3Dpostmessage% 26frame% 3Df3760623c% 26result% 3DxxRESULTTOKENxx & return_session = 1 & sdk = joey & session_version = 3 & v = 1. à partir du cadre avec l'URL http://www.andrewdothay.net/prj/facebook/ .

Les domaines, protocoles et ports doivent correspondre.

Des idées sur ce qui se passe avec Chrome ici?

Mise à jour

J'ai découvert que Chrome sur la machine d'aujourd'hui bloquait la fenêtre de connexion lorsque j'appelais FB.login (), mais je sais que je n'ai pas reçu ces 190 messages d'erreur dans la console JavaScript hier .

Ainsi, lorsque j'autorise les fenêtres contextuelles dans Chrome, cela fonctionne pour un utilisateur final, mais tous ces nouveaux messages d'erreur tuent mon expérience de diagnostic en tant que développeur.

javascriptfacebookgoogle-chrome
60
a7drew

J'ai trouvé la solution. Si vous exécutez FB.login sans action de l'utilisateur, webkit bloque les fenêtres contextuelles.

Par exemple, j'ai utilisé un système d'invitation sur mon projet. Il y avait une entrée/texte pour entrer le code d'invitation. J'ai vérifié que le code d'invitation est disponible avec une demande ajax/post. s'il est disponible, je lance FB.login (). Comme vous le devinez, le navigateur a bloqué la fenêtre contextuelle et des tonnes d'erreurs sont apparues sur la console js.

Vous devez donc exécuter FB.login () après une action utilisateur. Je mettrai un bouton de connexion Facebook entre ajax/post et FB.login (). Les utilisateurs devront cliquer dessus - ce qui est nul - mais ils ne verront aucun problème.

Au fait, le problème se reproduit après quelques jours. Je pense qu'il s'agit du système de confiance du navigateur. Lorsque vous le développez, vous le visitez souvent, le navigateur pense qu'il est fiable au début. Je ne suis pas sûr de cette partie mais ma solution fonctionne.

29
Mücahit Yılmaz

Dans mon cas, c'était à cause de Facebook JS chargé plusieurs fois sur une seule page: un pour la connexion et le second pour le bouton "J'aime". La suppression de la référence dans le module "like" fait gagner du temps.

5
Meta

Dans mon cas, le problème était lié à <div id="fb-root"></div> tag. Je ne le mettais pas immédiatement après l'ouverture <body> tag, tel que recommandé par la documentation .

Après l'avoir placé au bon endroit, l'erreur "JavaScript non sécurisé ..." s'est arrêtée.

2
fjsj

La suppression de l'option 'xfbml: true' de mon appel FB.init a résolu ce problème pour moi.

J'avais le problème dans le navigateur Internet par défaut sur Android Jelly bean

2
Pakage

Mücahit Yılmaz a raison. Prenez l'exemple que j'ai collé ci-dessous et si vous utilisez la méthode setTimeout (), cela échoue, sinon cela fonctionne. Je reçois toujours le message d'avertissement en boucle jusqu'à ce que je me connecte correctement, mais c'est un petit prix à payer. Je suis sûr que les utilisateurs ne le verront pas.

$(document).ready(function() {
$("#facebook_link").click(function() {
    //setTimeout(fb);
    fb();
    return false;
});

function fb() {
    FB.getLoginStatus(function(response) {
        if (response.session) {
            // logged in and connected user, someone you know
            gotResponse(response);
        } else {
            // no user session available, someone you dont know
            FB.login(function(response) {
                if (response.session) {
                    // user successfully logged in
                    gotResponse(response);
                } else {
                    // user cancelled login, do nothing
                }
            });
        }
    });
}

function gotResponse(response) {
    console.dir(response);
}

});

C'est facile à reproduire: connectez-vous à Facebook dans un autre onglet, puis essayez ce code et vous ne verrez aucun avertissement. Déconnectez-vous, puis essayez le code et vous obtenez les avertissements. C'est parce qu'il frappe le bloc .login.

2
mdeanda

J'ai eu ce problème avec un navigateur chrome et cela était dû à mes paramètres chrome. J'ai eu le navigateur configuré pour interdire aux sites tiers de définir des données de cookies. L'autorisation des fenêtres contextuelles n'était pas un problème pour moi. Lorsque l'iFrame facebook est créé, il doit définir un cookie qu'il utilise ensuite pour suivre si l'utilisateur doit se connecter. Si ce cookie n'est pas autorisé à être configuré, le site échoue. Une chose qui serait utile dans l'API Facebook serait un paramètre qui montre quand quelque chose échoue, je ne vois pas cela comme un événement auquel on peut s'abonner et assigner un rappel.

Voici un lien vers le sdk javascript FB sur les abonnements. Toute réponse sur la recherche d'un rappel pour les demandes ayant échoué serait appréciée.
https://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/

1
George Foster

Et dans mon cas, le problème était lié au type de protocole: de:

<div class="fb-like-box" data-href="https://www.facebook.com/xxxxxx"

à:

<div class="fb-like-box" data-href="http://www.facebook.com/xxxxxx"

comme ma boutique en ligne n'utilisait pas https, j'ai supprimé 's' de l'attribut data-href de la likebox.

1
Michal - wereda-net

La solution de Mücahit Yılmaz a également fonctionné pour moi. Je n'avais pas besoin d'accéder aux informations de l'utilisateur, j'ai donc supprimé le script de connexion de l'exemple d'application. Suppression du message de bienvenue et de toute information nécessitant des informations stockées dans le $basic variable.

0
deewilcox