Cette astuce montre comment savoir, en JS, si un visiteur est connecté à ses comptes sociaux. C’est tout bête, mais étonnamment ça marche à peu près partout.

Le principe

La plupart des sites ont une page de login :

https://exemple.com/login

Quand on accède à une autre page pour laquelle on doit être connecté, on est redirigé vers la page de login, dont l’URL mentionne alors l’URL ou le chemin qui avait été demandée :

https://exemple.com/login?redir=/page-demandée

L’astuce en JS, c’est de forger l’URL pour un site, en redirigeant sur une image. Typiquement, la favicon (présente sur tous les sites). Comme ça :

https://exemple.com/login?redir=/favicon.ico

On fait donc une requête AJAX et on regarde ce qui se passe :

• si le fichier retourné est une image (l’icône), alors c’est qu’il y a une redirection, parce que l’utilisateur est connecté. Bingo.
• autrement (si on ne reçoit pas une image), alors on est probablement sur la page de login (en HTML), car l’utilisateur n’est pas connecté.

En JS, ça veut dire que si on met l’URL forgée sur un img.src, alors :
– img.onload() fonctionne si l’utilisateur est connecté (img reçoit bien une image)
– img.error() est lancée si l’utilisation n’est pas connecté (img reçoit un document HTML).

On peut essayer, ça marche sur beaucoup de sites. Sur les liens suivants, si vous voyez l’icône, alors vous êtes connecté. Autrement, vous verrez la page de connexion du site.
Ce test peut très bien être effectué par n’importe quel site web sur tous les sites du monde. N’importe quel site web peut donc voir si vous êtes connecté ou non sur Twitter, Facebook, Amazon…

Essayer ici ?

Vous pouvez tester ici, pour 5 sites : Essayer !

<script>function socialNetworkTest(){var n=document.getElementById("socialMediaList");[{url:"https://twitter.com/login?redirect_after_login=https%3A%2F%2Ftwitter.com%2Ffavicon.ico",name:"Twitter"},{url:"https://www.facebook.com/login.php?next=https%3A%2F%2Fwww.facebook.com%2Ffavicon.ico%3F_rdr%3Dp",name:"Facebook"},{url:"https://accounts.google.com/ServiceLogin?passive=true&continue=https%3A%2F%2Fwww.google.com%2Ffavicon.ico&uilel=3&hl=de&service=youtube",name:"Google"},{url:"https://login.live.com/login.srf?wa=wsignin1.0&wreply=https%3A%2F%2Fprofile.microsoft.com%2FregsysProfilecenter%2FImages%2FLogin.jpg",name:"Microsoft"},{url:"https://github.com/login?return_to=https%3A%2F%2Fgithub.com%2Ffavicon.ico%3Fid%3D1",name:"Github"}].forEach(function(e){var o=document.createElement("img"),t=document.createElement("li");o.src=e.url,o.onload=function(){t.appendChild(document.createTextNode(e.name+" : connecté")),n.appendChild(t)},o.onerror=function(){t.appendChild(document.createTextNode(e.name+" : non connecté")),n.appendChild(t)}})}

Le risque

Ici je ne fais rien de méchant. Par ailleurs, aucune information n’est envoyée à mon site.

Mais j’aurais pu.

J’aurais également pu faire ça massivement, et voir quel pourcentage de mes visiteurs sont connectés à Twitter, ou à Facebook.

Pire, si je vois que vous êtes connectés, alors il peut très bien lancer une requête sur la page de déconnexion et vous déconnecter :

http://example.com/logout?

Ce n’est pas dangereux, ça, mais c’est chiant.

Ce qui peut être dangereux, c’est si j’accède à ce genre de page :

• example.com/panier
• example.com/paiement (pour ça, n’activez jamais le paiement en 1 clic sur les sites d’achat, je pense à Amazon par exemple).
• example.com/mon_compte (là, ne mettez pas l’ID ou le nom d’utilisateur du compte dans l’URL de "mon compte" — même si une requête plus ciblée et plus complexe permettrait très bien d’extraire certaines informations)
• example.com/changer_mon_mot_de_passe (pour ça, il faut toujours aussi exiger de taper l’ancien mdp pour en choisir un nouveau)
• example.com/mot_de_passe_perdu (pour ça, validez en plusieurs étapes : demandez un code dans un l’email ou un truc en 2FA).
• etc.

Une solution ?

Pour l’internaute

Installez un bloqueur de requêtes, de scripts externes ou de publicité.

µBlock Origin peut bloquer toutes les requêtes vers les sites tiers.
L’extension kimetrak, elle, montre les requêtes qui sont faites.

Sous Firefox, on peut aussi isoler chaque site en mettant à « true » la clé suivante dans about:config : about:config?filter=privacy.firstparty.isolate (attention, ça va vous déconnecter de tous les sites, mais après il suffit de se reco et c’est bon). Merci à Mart-e pour l’astuce !

Pour les sites

Ça me semble assez simple : quand on accède à la page de login, alors on demande systématiquement de se connecter.
Peu importe si l’utilisateur est connecté ou pas, on exige une reconnexion. Seulement après la reconnexion on procède à la redirection.

C’est ce que fait par exemple Amazon : cette astuce, même avec le bon lien (ici) ne marche pas, car Amazon demande le mot de passe qu’on soit connecté ou pas. C’est bien.
Par contre, étrangement, c’est le cas pour Amazon.FR, mais pas pour Amazon.COM (lien de test), où l’astuce décrite ici fonctionne.

Sources

Ce « problème » n’est pas nouveau. Cet article, datant de 2012, en parle déjà : Detect if visitors are logged into Twitter, Facebook or Google+. Peu de sites semblent s’être bougés, pourtant.

J’ai mentionné Amazon.FR ci-dessus. Flickr et Yahoo semblent également avoir corrigé le problème.
La requête vers Twitter semble aussi poser problème quand elle est faite en AJAX. Pour les autres sites, je n’ai pas tout testé.

Il existe aussi des scripts tout fait avec plein de sites dedans, pour voir si on est connecté : login-check.js.

Sachez que tout ce qu’on navigateur affiche dans une page web, peut finir sur les serveurs de n’importe quel site qui possède un script dans cette page. Pensez-y.

Enfin, pour voir une liste d’informations que votre navigateur sait de vous : https://lehollandaisvolant.net/tout/tools/browser/