web-dev-qa-db-fra.com

Le meilleur moyen de masquer une adresse e-mail sur un site Web?

J'ai passé les derniers jours à mettre à jour mon site Web personnel. L'URL de mon site Web personnel est (mon prénom). (Mon nom de famille) .com, car mon nom de famille est plutôt inhabituel et j'ai eu la chance de pouvoir récupérer le nom de domaine. Mon adresse e-mail est (mon prénom) @ (mon nom de famille) .com. Alors vraiment, quand il s'agit de deviner, ce n'est pas très difficile.

Quoi qu'il en soit, je souhaite intégrer un lien mailto: sur mon site Web, afin que les gens puissent me contacter. Et bien que mon adresse e-mail ne soit pas très difficile à deviner, je préférerais ne pas la faire récupérer par des robots collecteurs de spam qui explorent simplement les sites Web pour rechercher des modèles d'adresses e-mail et les ajoutent à leur base de données.

Quel est le meilleur moyen pour moi d’obscurcir mon adresse e-mail, de préférence sous forme de lien? Les méthodes que je connais sont:

<a href="mailto:[email protected]">e-mail me</a>

Cela fonctionne, mais cela signifie également que dès que mon site Web apparaîtra sur Google, je me lancerai dans le spam, car les robots du spam collectent facilement mon adresse e-mail.

<img src="images/e-mail.png" />

Cela est moins souhaitable, car non seulement les visiteurs ne pourront pas cliquer dessus pour m'envoyer un courrier électronique, mais les robots anti-spam plus intelligents seront probablement en mesure de détecter les caractères contenus dans l'image.

Je sais qu'il n'y a probablement pas de solution parfaite, mais je me demandais ce que tout le monde pensait être le meilleur. Je suis certainement prêt à utiliser JavaScript si nécessaire, car mon site Web en utilise déjà des tonnes.

121
Adam Rezich

Je code les caractères en tant qu'entités HTML ( quelque chose comme ceci ). Il n'est pas nécessaire que JS soit activé et semble avoir arrêté la plupart des spams. Je suppose qu'un robot intelligent pourrait encore le récolter, mais je n'ai eu aucun problème.

94
chroder

Personnellement, j'ai renoncé à cacher mon adresse e-mail. Je trouve qu'il est plus facile de rechercher de meilleures solutions de filtrage du courrier indésirable que de craindre de faire de l'obscurcissement. Vous pourriez passer des jours à essayer de trouver le meilleur moyen de dissimuler votre adresse. Il suffit ensuite d’une personne pour la vendre à un spammeur et tout ce travail a été inutile.

80
Chad Birch

La solution actuellement acceptée consiste à créer un formulaire de contact permettant aux utilisateurs de vous envoyer un courrier électronique. Si vous recevez beaucoup de spam à partir de cela (je ne le fais pas sur mon site), vous pouvez ajouter un captcha pour faire bonne mesure, et vous serez loin du "fruit à portée de main" à ce stade.

Le fait est que si vous fournissez un lien sur lequel un utilisateur peut cliquer pour ouvrir son client de messagerie avec son adresse dans le champ À:, l'ordinateur est alors en mesure de déchiffrer l'adresse de messagerie de la page et peut donc un bot de spam.

66
JoshJordan

Vous avez mentionné ceci est pour votre site web personnel. Sur mon site personnel (par exemple, bobsomers.com), je n'ai qu'un paragraphe qui dit ceci:

Le meilleur moyen d'entrer en contact avec moi avant que le nouveau site est en place doit envoyer moi un email. Mon adresse email est mon Prénom sur ce site. Si vous ne peut pas comprendre de cet indice, Eh bien, vous pourriez trouver un email plus d'un défi que de comprendre mon adresse.

Les gens semblent être capables de comprendre cela très bien, car je reçois toujours des courriels légitimes. Parfois, les meilleures solutions ne nécessitent pas l'écriture de code. :)

40
Bob Somers

reCAPTCHA offre un simple service de dissimulation de courrier électronique . Vous n'avez pas besoin de créer un compte et pouvez commencer à l'utiliser immédiatement. Vous pouvez utiliser le service en tant que lien ou en tant que popup.

Une fois le captcha résolu, votre adresse e-mail apparaît sous la forme d'un href/mailto, de sorte que les utilisateurs qui ont configuré leurs clients de messagerie pour qu'ils utilisent leur navigateur puissent cliquer dessus.

36
Rich Apodaca

Apparemment utiliser CSS pour changer le sens de votre texte fonctionne plutôt bien. Ce lien met également à l’essai plusieurs autres méthodes d’obscurcissement.

Tout ce que vous utilisez va inévitablement être vaincu. Votre objectif principal devrait être d'éviter de gêner vos utilisateurs.

14
Brian Carper

Un moyen léger d’obscurcir la href d’une ancre est de l’encoder en base64:

> btoa('mailto:[email protected]')
< "bWFpbHRvOmVtYWlsQGV4YW1wbGUuY29t"

Et puis l'inclure hardcoded:

<a href="javascript:window.location.href=atob('bWFpbHRvOmVtYWlsQGV4YW1wbGUuY29t')">E-Mail</a>

Ou dynamiquement côté serveur, par ex. en PHP:

<a href="javascript:window.location.href=atob('<?= base64_encode("mailto:[email protected]") ?>')">E-Mail</a>

En combinaison avec la réversion de chaîne, il pourrait s'agir plutôt d'une sauvegarde anti-spam:

<a href="javascript:window.location.href=atob('<?= base64_encode("mailto:[email protected]") ?>')" style="unicode-bidi: bidi-override; direction: rtl;"><?= strrev("[email protected]") ?></a>
13
Fabio Poloni

N'utilisez pas de techniques d'obscurcissement ici car c'est probablement le premier endroit où les récupérateurs d'e-mails chercheront pour savoir comment les gens masquent les e-mails. Si votre adresse électronique doit être visible sur le site, ne copiez pas simplement la méthode de quelqu'un d'autre; dissimulez-le d'une manière unique qu'aucun autre site n'a utilisé pour que votre méthode ne soit pas connue des pêcheurs avant qu'ils ne visitent votre site.

12
Sam Hasler

Vous pouvez faire comme Google sur Google Code (et groupes). Affiche une partie de l'email et une partie cliquable ("..."). En cliquant, vous indiquez que vous souhaitez connaître le courrier électronique et que vous êtes invité à saisir un captcha. Ensuite, le courrier électronique (et d'autres?) Sont visibles pour vous.

8
Ross

Un site Web que je maintiens utilise un moyen JavaScript quelque peu simpliste pour (espère-t-il) empêcher les spambots d'entrer.

Les liens de messagerie appellent une fonction JS:

 function sendEmail (nom, domaine) {
 location.href = 'mailto:' + nom + '@' + domaine; 
} 

Pour vous assurer que seuls les utilisateurs pour lesquels JS est activé peuvent voir le lien, écrivez-les avec ceci:

 function writeEmailLink (realName, nom, domaine) {
 document.write ('<a href="javascript:sendEmail(\''
 + nom +'\', \' '+ domaine +'\')">'); 
 document.write (realName); 
 document.write ('</a>'); 
} 

L'utilisation d'une fonction JS pour écrire un lien qui en appelle un autre signifie qu'il existe deux couches de protection.

6
Stewart

le mien est en réalité simple:

<h3 id="email">[email protected]</h3><!-- add a fake email -->


    $(document).ready(function(){
//my email in reverse :)
            var s = 'moc.elibomajninbew@htiek';
            var e = s.split("").reverse().join("");
            $('#email').html('<a href="mailto:'+e+'">'+e+'</a>');
    });
5
keithics

J'utilise JavaScript obscur, jetez un coup d'oeil à celui-ci par exemple:

http://www.jottings.com/obfuscator/

5
Codebrain

Comme le dit une affiche ci-dessus, j’utilise également l’obscurcissement JavaScript du site Web jottings .

La page Web génère du JavaScript qui peut être amélioré. La chaîne de texte mailto: est en clair et identifiable par les robots (ce qui pourrait la repérer et la dissimuler), mais si vous entrez dans la page Web jottings.com une adresse électronique de la forme mailto:[email protected] au lieu de [email protected], puis supprimez le texte mailto: de Le code JavaScript généré génère soudainement un code JavaScript qui n’a rien à voir avec le courrier électronique, mais un code JavaScript aléatoire dont le contenu est saturé sur le Web. On peut encore améliorer cela en supprimant le texte du lien. J'ai remplacé la mienne par une image de mon adresse électronique dans une police assez obscure. Ensuite, juste au cas où cette méthode sur jottings.com deviendrait populaire, j'ai randomisé les noms de variables dans la sortie JavaScript pour empêcher un robot de repérer une instance de code JavaScript généré par des notes.

Il est évident que certaines de ces améliorations pourraient être intégrées au mécanisme même des notes, et comme le code est ouvertement disponible, cela serait relativement facile.

Un exemple peut rendre cela un peu plus clair. J'ai utilisé l'obfuscateur Jottings sur le lien ci-dessus pour masquer mailto:[email protected] (remarque: je triche sur l'intention initiale du site Web Jottings en entrant la chaîne mailto:[email protected] au lieu de [email protected]) avec le texte "Send Me Email", lequel notes ont été transformées en ce code Javascript:

<script type="text/javascript" language="javascript">
<!--
// Email obfuscator script 2.1 by Tim Williams, University of Arizona
// Random encryption key feature by Andrew Moulden, Site Engineering Ltd
// This code is freeware provided these four comment lines remain intact
// A wizard to generate this code is at http://www.jottings.com/obfuscator/
{ coded = "3A1OTJ:[email protected]"
  key = "J0K94NR2SXLupIGqVwt8EZlhznemfaPjs7QvTB6iOyWYo3rAk5FHMdxCg1cDbU"
  shift=coded.length
  link=""
  for (i=0; i<coded.length; i++) {
    if (key.indexOf(coded.charAt(i))==-1) {
      ltr = coded.charAt(i)
      link += (ltr)
    }
    else { 
      ltr = (key.indexOf(coded.charAt(i))-shift+key.length) % key.length
      link += (key.charAt(ltr))
    }
  }
document.write("<a href='mailto:"+link+"'>Send Me Email</a>")
}
//-->
</script><noscript>Sorry, you need Javascript on to email me.</noscript>

Une fois récupéré, je le colle dans un éditeur et:

  1. enlever le mailto:
  2. remplacer le texte du lien par un pointeur sur une image de mon adresse électronique 
  3. renommer toutes les variables
  4. remplacer la section "noscript" par un autre lien vers l'adresse de messagerie image

Je me retrouve avec ceci:

<script type="text/javascript" language="javascript">
<!--
// Email obfuscator script 2.1 by Tim Williams, University of Arizona
// Random encryption kkeoy feature by Andrew Moulden, Site Engineering Ltd
// This kudzu is freeware provided these four comment lines remain intact
// A wizard to generate this kudzu is at http://www.jottings.com/obfuscator/
{ kudzu = "3A1OTJ:[email protected]"
  kkeoy = "J0K94NR2SXLupIGqVwt8EZlhznemfaPjs7QvTB6iOyWYo3rAk5FHMdxCg1cDbU"
  shift=kudzu.length
  klonk=""
  for (variter=0; variter<kudzu.length; variter++) {
    if (kkeoy.indexOf(kudzu.charAt(variter))==-1) {
      lutu = kudzu.charAt(variter)
      klonk += (lutu)
    }
    else {
      lutu = (kkeoy.indexOf(kudzu.charAt(variter))-shift+kkeoy.length) % kkeoy.length
      klonk += (kkeoy.charAt(lutu))
    }
  }
document.write("<a href='"+klonk+"'><img src='contactaddressimage.png' alt='Send Me Email' border='0' height='62' width='240'></a>")
}
//-->
</script>
<noscript>
    <img src="contactaddressimage.png" border="0" height="62" width="240">
    <font face="Arial" size="3"><br>&nbsp;</font></p>
</noscript>
4
Al Whaley

Je ne sais pas si cela fonctionnerait bien. Ne pouvez-vous pas laisser votre adresse électronique à l'extérieur et la charger avec un appel AJAX une fois le chargement de la page terminé? Je ne sais pas si les robots de spam peuvent récupérer le code HTML modifié ou s'ils sont assez intelligents pour écouter sur un autre trafic HTTP et essayer de choisir des adresses électroniques ou s'ils scannent simplement la page telle qu'elle est reçue la première fois.

3
uriDium

Un gars a testé neuf manières différentes de présenter une adresse email sur une page, puis les résultats publiés sur son blog. 

Ses trois meilleurs moyens étaient:

  1. Changer le sens du code avec CSS
  2. Utilisation de l'affichage CSS: aucun
  3. Chiffrement ROT13

Avertissement - cela a été posté il y a deux ans. Les robots de spam pourraient être devenus plus intelligents.

2
Doug Harris

Une autre approche pourrait consister à utiliser un framework JavaScript et à lier les données/modèles aux éléments HTML. Dans le cas d’AngularJS, les éléments HTML s’écriraient comme suit:

<a href="mailto:{{contactEmail}}"><span>{{contactEmail}}</span></a>

La liaison d'interpolation {{data}} utilise une variable d'étendue contenant la valeur de courrier électronique réelle. En outre, vous pouvez également utiliser un filtre qui gère le décodage de l’e-mail comme suit:

<a href="mailto:{{contactEmail | decode}}"><span>{{contactEmail | decode}}</span></a>

Les avantages sont dans la façon dont le HTML est écrit. L'inconvénient est qu'il nécessite un support de script pour lequel certains pourraient être un non non.

juste une autre approche.

1
ozkary

Honnêtement, votre problème peut être sans objet si vous posez la question de savoir si un mailto est vraiment ce que vous voulez utiliser. Par exemple, beaucoup de personnes qui utilisent la messagerie Web ou ne disposent pas de la configuration du client de messagerie appropriée dans leur navigateur ne bénéficieront pas d'un mailto. Vous exposez votre adresse électronique à une fonction qui ne fonctionnera pas pour une grande partie de vos utilisateurs.

Ce que vous pourriez faire à la place est d’utiliser un formulaire pour envoyer le courrier électronique dans les coulisses afin que l’adresse électronique soit masquée et que vous n’ayez pas à vous soucier des pauvres saps qui ne bénéficieront pas d’un mailto.

0
Brad Barker

Utilisation de JQuery, mais peut facilement être porté sur JS si nécessaire. Prendra le bloc HTML suivant. Cet exemple que j'ai fourni concerne également les liens tel: pour les appels téléphoniques.

<a class="obfuscate" 
 href="mailto:archie...trajano...net">
 archie...trajano...net
</a>
<a class="obfuscate"
 href="tel:+One FourOneSix-EightFiveSix-SixSixFiveFive">
 FourOneSix-EightFiveSix-SixSixFiveFive
</a>

et le convertir aux liens appropriés en utilisant Javascript.

 $ (". obfuscate"). each (function () {

 $ (this) .html ($ (this) .html () 
. remplacer ("...", "@"). remplacer (/\.\.\./g, ".") 
. remplacer (/ One/g, "1") 
. remplacer (/ Two/g, "2" ) 
. remplacer (/ Three/g, "3") 
. remplacer (/ Four/g, "4") 
. remplacer (/ Five/g, "5") 
. remplacer (/ Six/g, "6") 
. remplacer (/ Seven/g, "7") 
. remplacer (/ Huit/g, "8") 
. remplacer (/ Nine/g, "9") 
. remplacer (/ Zero/g, "0")) 

 $ (this) .attr ("href", $ (this) .attr ("href") 
. remplacer ("...", "@"). remplacer (/\.\.\./g, ".") 
. remplacer (/ One/g/"1") 
.replace (/ Two/g, "2") 
. remplacer (/ Trois/g, "3") 
. remplacer (/ Four/g, "4") 
. remplacer (/ Cinq/g, "5") 
. remplacer (/ Six/g, "6") 
. remplacer (/ Seven/g, "7") 
. remplacer (/ Huit/g, " 8 ") 
. remplacer (/ Neuf/g," 9 ") 
. remplacer (/ Zero/g," 0 ")) 

}) 

Je l'ai documentée plus en détail ici https://trajano.net/2017/01/obfuscating-mailto-links/

L'algorithme de de/obfuscation est assez simple, donc il n'est pas trop éprouvant d'écrire non plus (pas besoin d'analyse en base64)

0
Archimedes Trajano
<!-- Multi-Email Obfuscator  -->
<!-- step 1: &#064; = @  -->
<!-- step 2: a scrap element  -->
<!-- step 3: ROT13 encode for .com  -->
info<!-- step 1 -->&#064;<!-- step 2 --><b style="display:none">my</b>domain<!-- step 3 --><script>document.write(".pbz".replace(/[a-zA-Z]/g,function(c){return String.fromCharCode((c<="Z"?90:122)>=(c=c.charCodeAt(0)+13)?c:c-26);}));</script>
0
PHC

Depuis cette solution n'est mentionnée nulle part, mais fonctionne bien pour moi:

Je fais ça:

  • créer un lien mailto avec un faux email. J'aime [email protected] pour des raisons évidentes: Spammer peut spammer son propre réseau de robots tout en utilisant cette adresse décochée.

  • chiffrer la véritable adresse e-mail et la placer dans une plage cachée, sans rapport, mais retrouvable, ou autre élément de votre choix. Évidemment, pour masquer l’e-mail et le cacher à l’abatteur. Selon la structure de votre projet, vous pouvez même vouloir le placer dans une variable JS ou Session.

  • créez un gestionnaire de clics pour ces liens après une seconde qui déchiffre et écrivez la bonne adresse email dans le faux lien mailto sans empêcher les valeurs par défaut. Je ne pense pas que les robots d'exploration cliquent sur les liens mailto, mais s'ils le voulaient, ils n'attendraient probablement pas une seconde, alors qu'un être humain devrait être extrêmement rapide pour cliquer sur un lien dans la première seconde après le chargement de page.

Vous avez maintenant un lien mailto totalement fonctionnel mais obscurci, discret et sécurisé.

Exemple de fichier php:

<html>
<head>
<title>E-Mail Obfuscating</title>
</head>
<body>
<?php
$email = "[email protected]";
echo "<a class='emailLink' href='mailto:[email protected]' >Send me an e-mail!</a>"
    ."<span style='display:none' data-hash='" . base64_encode($email) . "' />";
?>
<script>
<!--
var emailLinks = document.getElementsByClassName("emailLink");
setTimeout(function() {
    for(var i=0; i <emailLinks.length; ++i){
        emailLinks[i].addEventListener("click", function(){
            let encodedEmail = this.nextSibling.getAttribute('data-hash');
            let decodedEmail = atob(encodedEmail);
            this.href = "mailto:" + decodedEmail;
            this.text = decodedEmail;
        });
    }
}, 1000);

-->
</script>
</body>
</html>

Que le code soit avec vous.

0
mondjunge

Si vous travaillez avec PHP, vous pouvez récupérer un script gratuit qui le fait automatiquement. Il s’appelle "Private Daddy" et nous l’utilisons pour notre propre service de streaming audio en ligne. Juste une ligne de code et ça marche tout de suite ... vous pouvez le récupérer ici

0
Reuven

Si vous dites sur votre site que "Mon adresse e-mail est (mon prénom) @ et (mon nom de famille) .com.", Et que votre nom et votre prénom sont bien évidents, cela semble être la meilleure protection anti-spam vous allez avoir.

0
Dean J

Cloudflare offre maintenant un service gratuit de masquage d'e-mails . Cela pourrait être une option si vous utilisez Cloudlfare.

0
alljamin

Si quelqu'un utilise Rails, il peut utiliser la gemme actionview-encoded_mail_to. ( https://github.com/reed/actionview-encoded_mail_to )

Il y a quelques options:

: encode - Cette clé acceptera les chaînes "javascript" ou "hex" . Passer "javascript" créera et encodera dynamiquement le mailto link puis l'évalue dans le DOM de la page. Cette méthode ne montrera pas le lien sur la page si le JavaScript est désactivé. Qui passe "hex" va encoder hexadresse email_address avant de sortir mailto lien. 

: replace_at - Lorsque le nom du lien n'est pas fourni, le fichier email_address est utilisé pour le libellé du lien. Vous pouvez utiliser cette option pour masquer l'adresse e-mail en remplaçant le signe @ par la chaîne donné comme valeur. 

: replace_dot - Lorsque le nom du lien n'est pas fourni, l'adresse_mail est utilisée pour le libellé du lien. Vous pouvez utiliser cette option pour masquer l’adresse e-mail en remplaçant le. dans l'email avec la chaîne donnée comme valeur.

0
chug2k