Obfuskace emailu

Pavel Tipy & triky, JavaScript, CSS, HTML

Obfuskace, neboli znepřehlednění, nám pomůže bránit se vyhledávacím robotů. Ti stále prohledávají weby a hledají nové emailové adresy, kam posílat nevyžádanou poštu. Obrana někdy může být velmi jednoduchá, ale je vůbec zapotřebí?

Obfuskace emailu

Pokud vkládáte na web svůj email, musíte počítat s tím, že jej najdou roboti a začnou na ně rozesílat spam. Má cenu se něčemu takovému bránit? A pokud ano tak jak.

Neprovádět obfuskaci, existují antispamy

Jeden z názorů, který jsem našel, tvrdí, že je zbytečné emailové adresy skrývat. Existují zde antispamy a obfuskace vždy uživateli znepříjemní jejich čtení. Osobně mám GMail, má adresa je na hodně webech a spamů projde okolo 10 za celý týden. Všechny však zapadnou do složky spam, nikoli do přijaté pošty.

Ukázka obtěžování uživatele

Jako ukázku obfuskace, která mě někdy dokáže extrémně vytočit je InNET mé vysoké školy. Pokud se podíváte na odkaz, zkuste si zkopírovat emailovou adresu. Ano funguje po kliknutí mailto odkaz, ale pokud email chci někomu zkopírovat a poslat, tak jej raději opíšu.

Příjemná, lehká a neobtěžující cesta

Při dalším hledání jsem našel skvělý článek, který porovnával různé metody a jejich úspěchy. Opravdu chvályhodné je testování po dobu 1,5 roku, nikoli žádný fast 'n' furious test. Je již sice staršího data, přesto jsem se jim inspiroval.

CSS a display: none

Pokud jednotlivé části emailové adresy skryjeme pomocí CSS vlastnosti display: none, uživatel uvidí správnou adresu, po zkopírování adresa bude také správná. Jediná nevýhoda je nefunkčnost odkazu, což budeme muset vyřešit pomocí JavaScriptu.

.hpe{ /* třídu si pojmenujte jak chcete, já vybírat krátký název */
  display: none;
}
<!-- Použití s jQuery -->
<a href="#" class="emailAddress">
pavel.k<span class="hpe">obfusc</span>utac@g<span>mail</span>.com</a>


<!-- Použití bez jQuery -->
<a href="#" onclick="this.href = 'mailto:' + this.innerHTML.replace(/<span class=&quot;hpe&quot;>.*?<\/span>/g,'').replace(/<.*?>/g,'');">
pavel.k<span class="hpe">obfusc</span>utac@g<span>mail</span>.com</a>
$(function(){
  $("body").on("click",".emailAddress",function(e){
    e.preventDefault();
    window.location = "mailto:" + $(this).html().replace(/<span class="hpe">.*?<\/span>/,'').replace(/<.*?>/,'');
  });
});

(Ne)funkční ukázka

Na JSFiddle jsem opět vložit ukázku obfuskace jak pro použití s jQuery tak bez. V mém případě odkazy fungují správně, ale GMail má zákázáno otevírání ve frame. Proto po kliknutí se nic nestane, pouze se vypíše chybová hláška do konzole.

Odkaz na JSFiddle (Demo) a ukázka chybové hlášky z konzole:

Zakázání GMailu ve frame


Pokud provádíte obfuskaci, nebo jinak skrýváte emaily, podělte se s námi v komentářích. Díky

Přidat komentář

Právě odpovídáte na existující komentář. Zrušit

Komentáře

Tesy

http://tlukas.eu 9.5.2015 18:39

Řadím se do té první skupiny, obfuskaci nijak neřeším a spoléhám na SPAM filtry GMailu. Přijde mi to zbytečné a pro koncové uživatelé obtěžující (viz příklad s InNETem).

Pokud bych něco takového už dělal, tak spíše tím, že bych třeba nahradil znak @, například za [zavináč] nebo nějakým takovým způsobem, který zas až tak neobtěžuje.

Odpovědět

Ivo

http://blog.kostecky.cz 24.5.2015 22:38

Hezké! Já to taky řešil a nakonec jsem šel cestou textové obfuskace, protože programová je komplikující. Líbí se mi, jak to řeší David Grudl:

<p>E-mail <a href="mailto:david@grudl.com" class="email">david@<!---->grudl.com</a></p>

P.S. jsem rád, že nejsem sám, kdo u InNETu vždy vybouchne...

Odpovědět

Pavel

http://www.kutac.cz/blog/ 24.5.2015 22:45

Co se týče toho co používá David, tak podle zmíněného článku nějaký spam prošel. Ale je to taky jednodušší varianta. Hodně záleží na použití.

Novinky z blogu

Async / await

Asynchronní programování v Javascriptu bez callbacků a Promise nemusí být nutně sci-fi. Co všechno umí klíčová slova async /...

Další články