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

J'ai passé ces 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 récupérer le nom de domaine. Mon adresse e-mail est (mon prénom) @ (mon nom) .com. Alors vraiment, quand il s'agit de le deviner, ce n'est pas très difficile.

Quoi qu'il en soit, je souhaite intégrer un lien mailto: dans 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ère ne pas la faire récolter par des robots de spam qui explorent simplement les sites Web à la recherche de modèles d'adresses e-mail et les ajoutent à leur base de données.

Quelle est la meilleure façon pour moi de masquer 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 aussi que dès que mon site Web arrivera sur Google, je pataugerai dans les spams, car les robots spammeurs choisissent facilement mon adresse e-mail.

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

Ceci est moins souhaitable, car non seulement les visiteurs ne pourront pas cliquer dessus pour m'envoyer un e-mail, mais des robots anti-spam plus intelligents seront probablement capables de détecter les caractères que contient l'image.

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

J'encode les caractères comme entités HTML ( quelque chose comme ça ). Il ne nécessite pas l'activation de JS 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.

Personnellement, j'ai renoncé à cacher mon adresse e-mail. Je trouve plus facile de chercher de meilleures solutions de filtrage des spams que de me soucier de l'obscurcissement. Vous pourriez passer des jours à essayer de trouver le meilleur moyen de masquer votre adresse, puis il suffit d'une seule personne pour vendre votre adresse à un spammeur et tout ce travail est inutile.

La solution actuellement acceptée consiste à créer un formulaire de contact qui permet aux utilisateurs de vous envoyer un e-mail. Si vous recevez beaucoup de spam de cela (je ne le fais pas sur mon site), alors vous pouvez ajouter un captcha pour faire bonne mesure, et vous serez loin d'être le «fruit du travail» à ce stade.

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

Vous avez mentionné que cela concerne votre site Web personnel. Sur mon site personnel (par exemple, bobsomers.com), j'ai juste un paragraphe qui dit ceci:

La meilleure façon de me contacter avant la mise en place du nouveau site est de m'envoyer un e-mail. Mon adresse e-mail est mon prénom sur ce site. Si vous ne pouvez pas le comprendre à partir de cet indice, eh bien, vous pourriez trouver le courrier électronique plus difficile que de déterminer mon adresse.

Les gens semblent être en mesure de comprendre cela très bien, car je reçois tout le temps des e-mails légitimes. Parfois, les meilleures solutions ne nécessitent pas d'écriture de code. :)

reCAPTCHA offre un service simple d' obfuscation des e-mails . Vous n'avez pas besoin de créer un compte et pouvez commencer à l'utiliser immédiatement. Vous pouvez utiliser le service sous forme de lien ou de popup.

Une fois le captcha résolu, votre adresse e-mail apparaît sous la forme d'un href / mailto, de sorte qu'elle peut être cliquée / suivie par les utilisateurs qui ont configuré leurs clients de messagerie pour qu'ils fonctionnent avec leurs navigateurs.

Un moyen léger de masquer hrefune ancre est de l'encoder en base64:

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

Et puis incluez-le codé en dur:

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

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

<a href="javascript:window.location.href=atob('<?= base64_encode("mailto:email@example.com") ?>')">E-Mail</a>

En combinaison avec la réversion de chaîne, cela pourrait être assez anti-spam:

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

Apparemment, utiliser CSS pour changer la direction de votre texte fonctionne plutôt bien. Ce lien a également un test d'un tas d'autres méthodes d'obscurcissement.

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

N'utilisez pas de techniques d'obfuscation ici car c'est probablement le premier endroit où les collecteurs d'e-mails chercheront à découvrir comment les gens dissimulent les e-mails. Si vous devez avoir votre adresse e-mail visible sur le site, ne copiez pas simplement la méthode de quelqu'un d'autre; obscurcissez-le d'une manière unique qu'aucun autre site n'a utilisée afin que votre méthode ne soit pas connue des moissonneurs avant qu'ils ne visitent votre site.

Vous pouvez faire comme Google sur Google Code (et les groupes). Affichez un par t de l'e-mail et une partie cliquable ("..."). Cliquer sur cela indique que vous souhaitez connaître l'e-mail et que vous êtes invité à remplir un captcha. Ensuite, l'e-mail (et les autres?) Vous sont visibles.

le mien est en fait simple:

<h3 id="email">hello@gmail.com</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>');
    });

J'utilise l'obfuscation JavaScript, jetez un œil à celui-ci par exemple:

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

Un site Web que je gère utilise un moyen JavaScript quelque peu simpliste pour (espérons-le) 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 qui ont activé JS 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.

Comme l'a dit une affiche ci-dessus, j'utilise également l'obfuscation JavaScript du site Web de jottings .

La page Web génère du JavaScript qui peut être amélioré. La mailto:chaîne de texte est en clair et identifiable par les robots (qui pourraient le repérer et dissiper cette chaîne), mais si l'on entre dans la page Web jottings.com une adresse e-mail du formulaire mailto:[email protected]au lieu de [email protected]puis supprime le textemailto:à partir du JavaScript qui est généré, on a soudain du JavaScript qui ne semble pas du tout avoir à voir avec le courrier électronique - juste du JavaScript aléatoire dont le Web est plein. On peut encore améliorer cela en supprimant le texte du lien - j'ai remplacé le mien par une image de mon adresse e-mail qui est 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 le JavaScript de sortie pour empêcher un robot de repérer une instance de code JavaScript généré par des notes.

Évidemment, certaines de ces améliorations pourraient être intégrées dans le mécanisme des notes lui-même, et comme le code est ouvertement disponible, ce serait relativement facile.

Un exemple peut rendre cela un peu plus clair. J'ai utilisé le Jottings Obfuscator sur le lien ci-dessus pour obscurcir mailto:[email protected](notez que je triche sur l'intention originale du site Web de notes en saisissant la chaîne mailto:[email protected]au lieu de [email protected]) avec le texte "Envoyez-moi un e-mail", dont les notes se sont transformées en 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 que je l'ai récupéré, je le colle dans un éditeur et:

1. retirer le mailto:
2. remplacer le texte du lien par un pointeur vers une image de mon adresse e-mail
3. renommer toutes les variables
4. remplacer la section "noscript" par un autre lien vers l'image de l'adresse e-mail

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>

Je ne sais pas comment cela fonctionnerait. Ne pourriez-vous pas laisser votre adresse e-mail et la charger à l'aide d'un appel AJAX une fois le chargement de la page terminé. Je ne sais pas si les robots spammeurs peuvent récupérer le code HTML modifié ou s'ils sont suffisamment intelligents pour écouter d'autres trafics HTTP pour essayer de choisir des adresses e-mail ou s'ils analysent simplement la page telle qu'elle est reçue la première fois.

Un gars a testé neuf façons différentes de présenter une adresse e-mail sur une page, puis a publié les résultats sur son blog.

Ses trois meilleurs moyens étaient:

1. Changer la direction du code avec CSS
2. Utilisation de l'affichage CSS: aucun
3. Cryptage ROT13

Mise en garde - cela a été publié il y a deux ans. Les robots spammeurs sont peut-être devenus plus intelligents.

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 cela fonctionne hors de la boîte ... vous pouvez le récupérer ici

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

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

La liaison d'interpolation {{data}} utilise une variable d'étendue qui contient la valeur réelle de l'e-mail. De plus, un filtre pourrait également être utilisé pour gérer le décodage de l'e-mail comme suit:

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

Les avantages résident dans la manière dont le HTML est écrit. L'inconvénient est qu'il nécessite un support de script, ce qui peut être un non non.

juste une autre approche.

Utilisation de JQuery, mais peut facilement être porté vers JS ordinaire si nécessaire. Prendra le bloc HTML suivant. Cet exemple que j'ai fourni est également pour les tel:liens 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 convertissez-le en liens appropriés en utilisant Javascript.

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

$ (ceci) .html ($ (ceci) .html ()
.replace ("...", "@"). replace (/\.\.\./ g, ".")
.replace (/ One / g, "1")
.replace (/ Deux / g, "2")
.replace (/ Trois / g, "3")
.replace (/ Quatre / g, "4")
.replace (/ Cinq / g, "5")
.replace (/ Six / g, "6")
.replace (/ Seven / g, "7")
.replace (/ Huit / g, "8")
.replace (/ Neuf / g, "9")
.replace (/ Zero / g, "0"))

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

})

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

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

La solution d'appel Ajax

Le mieux est d'avoir un formulaire sur le site Web et de ne pas afficher l'adresse e-mail, car tous les robots sont plus intelligents jour après jour, mais si vous avez besoin d'afficher une adresse e-mail sur le site Web, vous pouvez le faire avec un appel ajax sur votre serveur, et l'afficher en cliquant.

HTML

<a class="obfmail" href="#" rel="info">click here to show email address</a>

ou

<a class="obfmail" href="#" rel="info">
    <img src="img/click-to-show-email.jpg">
</a>

jQuery

$(document).one'click', '.obfmail', function(e) {
    e.preventDefault();
    a = $(this);
    addr = a.attr('rel');
    $.ajax({
        data: { 
            email: addr
        },
        url : "/a/getemail",
        type: "POST",
        dataType: 'json',
        success: function(data) {
            a.html(data.addr);
            a.attr('href', 'mailto:' + data.addr);
        }
    });
});

PHP

if($_POST['email']) {
    ...
    return json_encode(array(
        code     => '200',
        response => 'success',
        addr     => '[email protected]'
    ));
}

Pour plus de sécurité, vous pouvez changer .onpar .onecomme celui - ci $(document).one('click', '.obfmail', function(e) {ou même travailler avec un PHP généré jeton qui vous passez en données sur appel ajax, d'accepter un seul appel de la fonction ajax comme ceci:

html: <a class="obfmail" href="#" rel="info" token="w3487ghdr6rc">

jquery:

...
addr = a.attr('rel');
tkn  = a.attr('token');
$.ajax({
    data: { 
        email: addr,
        token: tkn
    }, ...

.

Il est également possible d'encoder l'adresse e-mail renvoyée ou de l'inverser.

.

Fonctionne bien pour les numéros de téléphone aussi!

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

Ce que vous pourriez faire à la place, c'est utiliser un formulaire pour envoyer l'e-mail dans les coulisses afin que l'adresse e-mail soit cachée et que vous n'ayez pas à vous soucier des pauvres saps qui ne bénéficieront pas d'un mailto.

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

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

Il existe quelques options:

: encode - Cette clé acceptera les chaînes "javascript" ou "hex". Passer "javascript" créera et encodera dynamiquement le lien mailto puis l'évaluera dans le DOM de la page. Cette méthode n'affichera pas le lien sur la page si l'utilisateur a désactivé JavaScript. Passer "hex" encodera en hexadécimal l'adresse email avant de sortir le lien mailto.

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

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

<!-- 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>

Cloudflare propose désormais un service gratuit d' obfuscation des e - mails . Cela pourrait être une option si vous utilisez Cloudlfare.

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

Je fais ça:

• créer un lien mailto avec un faux e-mail. J'aime [email protected] pour des raisons évidentes: le spammeur peut spammer son propre botnet en utilisant cette adresse non cochée.

• chiffrez l'adresse e-mail réelle et placez-la dans une plage cachée non liée mais trouvable ou dans tout élément de votre choix. Évidemment, pour masquer l'email et le cacher au moissonneur. Selon la structure de votre projet, vous voudrez peut-être même 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 l'adresse e-mail correcte dans le faux lien mailto n'empêchant pas les valeurs par défaut. Je ne pense pas que les robots d'exploration cliquent sur les liens mailto, mais s'ils le faisaient, ils n'attendront 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 la page.

Vous disposez désormais d'un lien mailto entièrement fonctionnel mais obscurci, honeypoté et sécurisé dans le temps.

Exemple de fichier php de travail:

<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.

Et si vous créiez un lien "Contactez-moi" pointant vers un répertoire protégé par un mot de passe? Bien sûr, vous devez donner le pass pour y accéder.

"Contactez-moi"> •••••••••••> contact / index.html

Une fois accédée, la page contact / index.html révèle l'email, un mailto par exemple.

J'utilise une fonction PHP pour générer du javascript pour générer l'e-mail lors du chargement de la page. Notez que vous n'avez pas besoin PHP pour générer le JS au moment de l'exécution, vous pouvez générer le JS une fois localement, puis inclure le JS statique dans votre page.

Vous pouvez également utiliser la fonction liée avec cet extrait de code ci-dessous pour masquer automatiquement les adresses e-mail dans un HTML donné (où $ processorContent est le HTML):

 $emailMatches = array();
 $matchCount = preg_match_all('/(?:[a-zA-Z0-9_\.\-])+\@(?:(?:[a-zA-Z0-9\-])+\.)+(?:[a-zA-Z0-9]{2,4})+/', $processedContent, $emailMatches);

 if($matchCount > 0) {
    $emailMatches = $emailMatches[0];

    foreach($emailMatches as $email) {
    $replacement = createJSMailLink($email);

    $processedContent = str_replace($email, createJSMailLink($email), $processedContent);
 }

Vérifier ceci .

Le `` formulaire Enkoder '' cryptera votre adresse e-mail et convertira le résultat en un JavaScript auto-évalué, le cachant aux robots de collecte d'e-mails qui explorent le Web à la recherche d'adresses exposées. Votre adresse sera affichée correctement par les navigateurs Web, mais sera pratiquement indéchiffrable pour les robots de collecte d'e-mails.