Facebook JavaScript SDK over HTTPS charge des éléments non sécurisés

Question

J'ai une application Facebook qui utilise le Facebook Connect.js .

J'exécute mon application sur HTTPS. Tout le contenu du site est fourni par https:// à l'exception d'un certain contenu qui doit être inclus dans le site de Facebook. Connect.js

Le problème est que je reçois des messages d'avertissement indiquant que la page contient des éléments non sécurisés.

J'ai vérifié quels scripts sont chargés en utilisant Chrome L'onglet " Outils de développement " / " Réseau " de la page d'accueil du site Web de la Commission européenne permet de voir quels fichiers sont chargés et d'où ils proviennent.

Le seul que je peux voir qui est chargé par HTTP et non par HTTPS est un fichier appelé http://static.ak.facebook.com/connect/canvas_proxy.php .

Comment puis-je forcer ce fichier à utiliser HTTPS ?

Answer 1

TL;DR

set FB._https a true avant d'appeler FB.init . Comme ça :

FB._https = true;
FB.init({
    /* your app id and stuff */
});

Explication

Si vous décomposez le SDK JavaScript de Facebook, vous verrez qu'il s'agit essentiellement d'un objet littéral avec un certain nombre de propriétés. L'une de ces propriétés est _https qui est un booléen. Cette propriété détermine le jeu d'URL à utiliser (stocké dans le fichier FB._domain ) lors des demandes d'API. Il semble que Facebook conserve deux ensembles d'URL pour chaque type de demande d'API - une URL sécurisée et une URL non sécurisée - puis utilise une fonction de commutation appelée getDomain() pour déterminer lequel utiliser lors des demandes.

La raison pour laquelle le SDK JavaScript génère des avertissements de sécurité est due à la façon dont l'élément FB._https est définie. Voici comment elle est actuellement définie en date du 2011-8-24 :

_https: (window.name.indexOf('_fb_https') > -1)

Apparemment, Facebook pense que si le window.name la propriété a _fb_https en elle, alors il doit s'agir d'une application sécurisée. C'est manifestement incorrect. Le vrai test devrait être quelque chose de similaire à ceci :

_https: window.location.protocol == "https:"

Malheureusement, le SDK n'est pas open source ou même bien documenté, donc je ne peux pas soumettre une demande de modification pour ce changement :P. A court terme, réglage FB._https a true manuellement avant d'appeler FB.init devrait faire l'affaire.

Answer 2

Cela vous donnerait donc le même lien de protocole :

FB._https = (window.location.protocol == "https:");

Answer 3

J'ai rencontré ce problème il y a quelques jours. Toute mon application utilisait HTTPS et mon problème était que seules les photos de profil étaient chargées sur HTTP... Ma solution rapide et sale a été de remplacer manuellement tous les noms de domaine des photos de profil. Par exemple,

str_replace('http://profile.ak.fbcdn.net','https://fbcdn-profile-a.akamaihd.net',$user['pic_square']);

Vous devez vérifier l'URL des photos de votre profil. Je suppose qu'elles ne proviennent pas exactement du même endroit. Affichez l'URL de votre propre photo de profil et remplacez-la par la mienne à l'adresse suivante https://fbcdn-profile-a.akamaihd.net .

Après avoir regardé de plus près le Documentation sur Facebook :

Si vous souhaitez qu'une image soit renvoyée via une connexion sécurisée, vous pouvez donner la valeur 1 à l'argument return_ssl_resources : https://graph.facebook.com/4/picture?return_ssl_resources=1 .

J'ai trouvé un paramètre supplémentaire appelé return_ssl_resources et lorsqu'il est passé avec true il renvoie les photos de profil en utilisant HTTPS.

$fql = "SELECT uid, name, pic_square FROM user WHERE uid=me()";

$param = array( 'method' => 'fql.query', 'query' => $fql, 'return_ssl_resources'=>1);

$fbuser = $facebook->api($param);

Cela a fonctionné comme un charme, et j'ai cessé de recevoir les avertissements de sécurité mixtes. J'espère que cela vous aidera !

Answer 4

En complément de Ralph Holzmann et Simon Bächler, voici une solution encore plus percutante pour le cas où FB._. https ne suffit pas ;

FB._https = (window.location.protocol == "https:");
FB.init({
    ...
});
if (FB._https && window == window.parent) {
    if (FB._domain && FB._domain.staticfb && FB._domain.https_staticfb)
        FB._domain.staticfb = FB._domain.https_staticfb;
}

Voir aussi FB.Arbiter.inform() { ... FB.getDomain((d?'https_':'')+'staticfb',true) ... } where d=window!=window.parent&&... en date du 2012-Feb-10.

Answer 5

Il semble que FB._https ait été remplacé par :

FB._secure = (window.location.protocol == "https:");