Ukryj adres e-mail przed botami - Zachowaj mailto:

tl; dr

Ukryj adres e-mail przed botami bez używania skryptów i zachowaj mailto:funkcjonalność. Metoda musi również obsługiwać czytniki ekranu.

Podsumowanie

• Maskowanie wiadomości e-mail bez korzystania ze skryptów lub formularzy kontaktowych

• Adres e-mail musi być całkowicie widoczny dla ludzi i zachowywać mailto:funkcjonalność

• Adres e-mail nie może być w postaci obrazu .

• Adres e-mail musi być „całkowicie” ukryty przed robotami spamującymi, robotami spamującymi i innymi typami programów zbierających

Pożądany efekt:

• Żadnych skryptów , proszę. W projekcie nie ma używanych skryptów i chciałbym, żeby tak zostało .

• Adres e-mail jest wyświetlany na stronie lub można go łatwo wyświetlić po jakiejś interakcji użytkownika, takiej jak otwarcie modalu.

• Użytkownik może kliknąć na adres e-mail, co z kolei mogłoby wyzwolić mailto:funkcjonalność.

• Kliknięcie wiadomości e-mail spowoduje otwarcie aplikacji poczty elektronicznej użytkownika.

  Innymi słowy, mailto:funkcjonalność musi działać.

• Adres e-mail jest niewidoczny lub nie jest identyfikowany jako adres e-mail dla botów (obejmuje to źródło strony)

• Nie mam skrzynki odbiorczej pełnej spamu

Co NIE działa

• Dodanie formularza kontaktowego - lub czegoś podobnego - zamiast adresu e-mail

  Nienawidzę formularzy kontaktowych . Rzadko wypełniam formularz kontaktowy. Jeśli nie ma adresu e-mail, szukam numeru telefonu, a jeśli go nie ma, zaczynam szukać alternatywnej usługi. Wypełniłbym formularz kontaktowy tylko wtedy, gdybym absolutnie musiał.

• Zastąpienie adresu obrazem adresu

  Stwarza to OGROMNĄ wadę dla kogoś korzystającego z czytnika ekranu ( pamiętaj o niedowidzących w przyszłych projektach )

  Usuwa również tę mailto:funkcję, chyba że klikniesz obraz, a następnie dodasz mailto:funkcję jako hreflink, ale to mija się z celem i teraz e-mail jest widoczny dla botów.

Co może zadziałać:

• Sprytne wykorzystanie pseudo-elementswCSS

• Rozwiązania wykorzystujące base64kodowanie

• Podzielenie adresu e-mail i rozłożenie części w dokumencie, a następnie złożenie ich z powrotem w modalny sposób, gdy użytkownik kliknie przycisk (prawdopodobnie będzie to wymagało wielu CSSklas i użycia anchor tags)

• Zmiana htmlatrybutów za pośrednictwemCSS

  @MortezaAsadi z wdziękiem wspomniał o możliwości w komentarzach poniżej. Oto link do pełnej wersji - Artykuł pochodzi z 2012 roku:

  Co by było, gdybyśmy mogli użyć CSS do zmiany atrybutów HTML?

• Inne kreatywne rozwiązania, które wykraczają poza mój zakres wiedzy.

Podobne pytania / poprawki

• JavaScript: Chroń swój adres e-mail przez Joe Mallera

(To świetna poprawka zaproponowana przez Joe Mallera, działa dobrze, ale jest oparta na skrypcie . Oto jak to wygląda;

<SCRIPT TYPE="text/javascript">

  emailE = 'emailserver.com'

  emailE = ('yourname' + '@' + emailE)

  document.write('<A href="mailto:' + emailE + '">' + emailE + '</a>')

</script>



<NOSCRIPT>

  Email address protected by JavaScript

</NOSCRIPT>

• Szukam funkcji zaciemniania adresu e-mail tylko php

  (Sprytne rozwiązanie wykorzystujące obie PHPi CSSnajpierw odwrócenie wiadomości e-mail za pomocą PHP, a następnie odwrócenie jej z powrotem za pomocą CSS) Bardzo obiecujące rozwiązanie, które działa świetnie! Ale jest to zbyt łatwe do rozwiązania .

• Czy w dzisiejszych czasach warto zaciemniać adresy e-mail w sieci?

  (Poprawka Javascript)

• Najlepszy sposób na zaciemnienie adresu e-mail w witrynie internetowej?

  Wybrana odpowiedź działa . W rzeczywistości działa naprawdę dobrze. Polega na zakodowaniu wiadomości e-mail jako html entities. Czy można to poprawić?

  Oto jak to wygląda;

  <A HREF="mailto:
  
  &#121;&#111;&#117;&#114;&#110;&#097;&#109;&#101;&#064;&#100;&#111;&#109;&#097;&#105;&#110;&#046;&#099;&#111;&#109;">
  
  &#121;&#111;&#117;&#114;&#110;&#097;&#109;&#101;&#064;&#100;&#111;&#109;&#097;&#105;&#110;&#046;&#099;&#111;&#109;
  
  </A>

  Uruchom fragment koduHide results

  Rozwiń fragment

• Czy zaciemnianie adresu e-mail faktycznie działa?

  (Wybrana odpowiedź na to pytanie SuperUser jest świetna i przedstawia badanie ilości spamu otrzymanego przy użyciu różnych metod zaciemniania.

  Wygląda na to, że manipulowanie adresem e-mail za pomocą, CSSaby rtldziałał. Jest to ta sama metoda, której użyto w pierwszym pytaniu, do którego nawiązałem w tej sekcji.

  Nie jestem pewien, jaki wpływ mailto:na wyniki miałoby dodanie funkcjonalności do poprawki.

• Istnieje również wiele innych pytań dotyczących SO, na które wszystkie mają podobne odpowiedzi. Nie znalazłem niczego, co pasowałoby do mojego pożądanego efektu

Pytanie:

Czy byłoby możliwe zwiększenie wydajności (tj. Jak najmniej spamu) powyższych metod zaciemniania wiadomości e-mail poprzez połączenie dwóch lub więcej poprawek (lub nawet dodanie nowych), podczas gdy:

A- Utrzymanie mailto:funkcjonalności; i

B- Obsługa czytników ekranu

Edytować:

Wiele z poniższych odpowiedzi i komentarzy stawia bardzo dobre pytanie, wskazując jednocześnie na niemożliwość zrobienia tego bez jakiegoś powodujs

Pytanie, które jest zadawane / sugerowane, brzmi:

Dlaczego nie używać js?

Odpowiedź brzmi, że mam alergię js

Jednak żarty na bok,

Trzy główne powody, dla których zadałem to pytanie, to:

• Formularze kontaktowe są coraz bardziej akceptowane jako zamiennik podawania adresu e-mail - czego nie powinny.

• Jeśli można to zrobić bez skryptów, należy to zrobić bez skryptów.

• Ciekawość: (ponieważ jsobecnie używam jednej z poprawek) chciałem sprawdzić, czy omówienie tej sprawy doprowadziłoby do lepszego sposobu zrobienia tego.

Problem z twoim żądaniem dotyczy w szczególności "Wspierających czytników ekranu", ponieważ z definicji czytniki ekranu są swego rodzaju "botami". Jeśli czytnik ekranu musi być w stanie zinterpretować adres e-mail, robot indeksujący strony również mógłby go zinterpretować.

Celem mailtoatrybutu ma być również standard tworzenia adresów e-mail w Internecie. Pytanie, czy istnieje drugi sposób na zrobienie tego, jest rodzajem pytania, czy istnieje drugi standard.

Zrobienie tego za pomocą skryptów nadal będzie miało ten sam problem, co po załadowaniu strony, skrypt zostałby uruchomiony, a adres e-mail renderowany w DOM (chyba że wpiszesz adres e-mail on clicklub coś w tym stylu). Tak czy inaczej, czytniki ekranu nadal będą miały z tym problemy, ponieważ nie zostały jeszcze załadowane.

Szczerze mówiąc, po prostu kup usługę e-mail z przyzwoitym filtrem spamu i określ domyślny temat, który będzie łatwy do sortowania w skrzynce odbiorczej.

<a href="mailto:[email protected]?subject=Something to filter on">Email me</a>

Pytasz o to, czy standard ma dwa sposoby na zrobienie czegoś, jeden dla botów, a drugi dla nie-botów. Odpowiedź brzmi: tak nie jest i musisz po prostu walczyć z botami najlepiej, jak potrafisz.

Pokonanie botów pocztowych jest trudne. Możesz zajrzeć do sekcji Środki zaradcze związane z gromadzeniem adresów e-mail w Wikipedii.

Moja historia jest taka, że ​​napisałem bota wyszukiwania. Zindeksował ponad 105 000 adresów URL podczas pierwszego uruchomienia wiele lat temu. Z tego, czego się dowiedziałem, wynika, że ​​roboty indeksujące sieć dosłownie widzą WSZYSTKO, co jest tekstem, który pojawia się na stronie internetowej. Boty czytają wszystko oprócz obrazów.

Spamu nie można łatwo zatrzymać za pomocą kodu z następujących powodów:

1. CSS i JS nie mają znaczenia, gdy używasz tagu mailto:. Boty przeglądają strony HTML pod kątem tego słowa kluczowego „mailto:”. Wszystko, od tego dwukropka do następnego pojedynczego cudzysłowu lub podwójnego cudzysłowu (w zależności od tego, co nastąpi wcześniej), jest postrzegane jako adres e-mail. Adresy e-mail encji HTML - podobnie jak w powyższym przykładzie - można szybko przetłumaczyć za pomocą metody / funkcji odwróconego ASCII. Uruchomienie powyższego fragmentu kodu JavaScript szybko zamienia ciąg zaczynający się od: „” „” „…” w… „[email protected]”. (Mój robot wyszukujący wyrzucił href z mailto: adresy e-mail, ponieważ chciałem adresów URL stron internetowych, a nie adresów e-mail).

2. Jeśli strona powoduje awarię bota, autor bota dostroi bota, aby naprawić awarię z myślą o tej stronie, tak aby bot nie zawiesił się ponownie na tej stronie w przyszłości. Dzięki temu ich bot jest mądrzejszy.

3. Autorzy botów mogą pisać boty, które generują wszystkie znane odmiany adresów e-mail ... bez indeksowania stron i nigdy nie używają żadnych początkowych adresów e-mail. Chociaż może to być niewykonalne, nie jest to niewyobrażalne w przypadku dzisiejszych procesorów o dużej liczbie rdzeni (które są hiperwątkowe i działają z częstotliwością 4+ GHz), a także dostępności rozproszonego przetwarzania w chmurze, a nawet super komputerów. Można sobie wyobrazić, że ktoś może teraz stworzyć farmę botów do spamowania wszystkich, nie znając niczyjego adresu e-mail. 20 lat temu byłoby to niezrozumiałe.

4. Bezpłatni dostawcy poczty e-mail już wcześniej sprzedawali darmowe konta użytkowników swoim reklamodawcom. W przeszłości po prostu założenie bezpłatnego konta e-mail automatycznie gwarantowało im zielone światło do rozpoczęcia dostarczania spamu na ten adres e-mail ... bez korzystania z tego adresu e-mail w Internecie. Widziałem to wiele razy, w przypadku znanych nazw firm. (Nie wymienię żadnych nazwisk.)

5. Słowo kluczowe mailto: jest częścią tego dokumentu IETF RFC , w którym przeglądarki są zbudowane tak, aby automatycznie uruchamiać domyślnych klientów poczty e-mail za pomocą łączy zawierających to słowo kluczowe. JavaScript musi być używany do przerwania procesu uruchamiania aplikacji, kiedy to nastąpi.

Nie sądzę, aby można było zatrzymać 100% spamu podczas korzystania z tradycyjnych serwerów poczty e-mail bez korzystania z filtrów na serwerze poczty e-mail i prawdopodobnie przy użyciu obrazów.

Jest jedna alternatywa ... Możesz także zbudować podobnego do czatu klienta poczty e-mail, który działa wewnętrznie na stronie internetowej. To byłoby jak klient czatu na Facebooku. To coś w rodzaju e-maila, ale nie do końca. To po prostu komunikator 1-do-1 z funkcją archiwizacji ... która ładuje się automatycznie po zalogowaniu. Ponieważ ma funkcje załączników do dokumentów i linków, działa trochę jak e-mail ... ale bez spamu. Dopóki nie utworzysz dostępnego z zewnątrz interfejsu API, jest to zamknięty system, w którym ludzie nie mogą wysyłać do niego spamu.

Jeśli planujesz trzymać się ściśle tradycyjnej poczty e-mail, najlepszym rozwiązaniem może być uruchomienie czegoś takiego jak SpamAssassin Apache na firmowym serwerze pocztowym.

Możesz także spróbować połączyć wiele strategii, które wymieniono powyżej, aby utrudnić zbieraczom wiadomości e-mail zbieranie adresów e-mail ze stron internetowych. Nie zatrzymają 100% spamu, przez 100% czasu ... jednocześnie pozwalając 100% czytników ekranu pracować dla niewidomych gości.

Stworzyłeś naprawdę dobre spojrzenie na to, co jest nie tak z tradycyjną pocztą e-mail! Brawa dla ciebie za to!

Dobrym czytnikiem ekranu jest JAWS firmy Freedom Scientific . Używałem tego wcześniej, aby posłuchać, jak moje strony internetowe są czytane przez niewidomych użytkowników. (Jeśli słyszysz męski głos odczytujący obie czynności [np. Kliknięcie linku] i tekst, spróbuj zmienić jeden głos na żeński, tak aby jeden głos odczytywał czynności, a drugi czytał tekst. niedowidzący.)

Powodzenia w podejmowaniu działań zaradczych podczas zbierania adresu e-mail !

Oto podejście, które wykorzystuje JavaScript, ale ma raczej niewielki ślad. Jest to również bardzo „getto” i generalnie nie polecałbym podejścia z wbudowanym JS w HTML, z wyjątkiem tego, że w ogóle masz skrajną niechęć do używania JS.

<a
  href="#"
  data-contact="bGUtZW1haWxAdGhlLWRvbWFpbi5jb20="
  data-subj="QW4gQW1hemluZyBTdWJqZWN0"
  onfocus="this.href = 'mailto:' + atob(this.dataset.contact) + '?subject=' + atob(this.dataset.subj || '')"
  >
  Send an email
</a>

data-contactto adres e-mail zakodowany w base64. I data-subjjest opcjonalnym tematem zakodowanym w base64.

Głównym wyzwaniem związanym z robieniem tego bez JS jest to, że CSS nie może zmieniać atrybutów HTML. ( Podlinkowany artykuł jest zadumą typu „bułka z masłem” i nie ma żadnego związku z tym, co jest możliwe dzisiaj lub w najbliższej przyszłości).

Podejście do encji HTML, o którym wspomniałeś, lub jakaś jego odmiana, jest prawdopodobnie najprostszą opcją, która będzie miała pewną skuteczność. Ponadto iframepodejście jest sprytne, a podejście do przekierowywania serwera jest całkiem niesamowite. Ale wszystkie trzy są podatne na boty:

• Encje HTML należy po prostu przekonwertować (i wykrywanie to jest proste)
• Można po prostu śledzić dokument, do którego odwołuje się iframe
• Można też po prostu śledzić przekierowanie serwera

Zgodnie z podejściem przedstawionym powyżej, użycie adresu e-mail zakodowanego w base64 w data-contactatrybucie jest bardzo „jednorazowe” - o ile scrapper nie jest specjalnie zaprojektowany dla Twojej witryny, powinien działać.

Proste + dużo @ + edytowalne bez narzędzi

<a href="mailto:user@domain@@com"
   onmouseover="this.href=this.href.replace('@@','.')">
   Send email
</a>

Czy rozważałeś użycie Google Recaptcha Mailhide? https://www.google.com/recaptcha/admin#mailhide

Chodzi o to, że gdy użytkownik kliknie pole wyboru ( patrz nocaptcha poniżej ), zostanie wyświetlony pełny adres e-mail.

Podczas gdy recaptcha jest tradycyjnie trudna nie tylko dla czytników ekranu, ale także dla ludzi, z rolą Google nocaptcha recaptcha, o której możesz przeczytać tutaj, ponieważ odnoszą się one do testów dostępności. Wydaje się, że jest obiecujący w odniesieniu do czytników ekranu, ponieważ w ich widoku renderuje się jako tradycyjne pole wyboru.

Przykład 1 - niezabezpieczony, ale dla łatwego zilustrowania pomysłu

Oto przykład kodu bez użycia mailhide, ale zaimplementowanie czegoś za pomocą recaptcha: https://jsfiddle.net/43fad8pf/36/

<div class="container">
    <div id="recaptcha"></div>
</div>
<div id="email">
    Verify captcha to get e-mail
</div>

function createRecaptcha() {
    grecaptcha.render("recaptcha", {sitekey: "6LcgSAMTAAAAACc2C7rc6HB9ZmEX4SyB0bbAJvTG", theme: "light", callback: showEmail});
}
 createRecaptcha();

function showEmail() {
    // ideally you would do server side verification of the captcha and then the server would return the e-mail
  document.getElementById("email").innerHTML = "[email protected]";
}

Uwaga: w moim przykładzie mam e-mail w funkcji javascript. Idealnie byłoby, gdyby recaptcha została zweryfikowana po stronie serwera i zwróciłaby wiadomość e-mail, w przeciwnym razie bot może po prostu umieścić ją w kodzie.

Przykład # 2 - Walidacja po stronie serwera i zwrot wiadomości e-mail

Jeśli użyjemy bardziej podobnego przykładu, otrzymamy dodatkowe zabezpieczenia: https://designracy.com/recaptcha-using-ajax-php-and-jquery/

function showEmail() {
    /* Check if the captcha is complete */
    if ($("#g-recaptcha-response").val()) {
        $.ajax({
            type: ‘POST’,
            url: "verify.php", // The file we’re making the request to
            dataType: ‘html’,
            async: true,
            data: {
                captchaResponse: $("#g-recaptcha-response").val() // The generated response from the widget sent as a POST parameter
        },
        success: function (data) {
            alert("everything looks ok. Here is where we would take 'data' which contains the e-mail and put it somewhere in the document");
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert("You’re a bot");
        }
    });
} else {
    alert("Please fill the captcha!");
}
});

Gdzie verify.php to:

$captcha = filter_input(INPUT_POST, ‘captchaResponse’); // get the captchaResponse parameter sent from our ajax

/* Check if captcha is filled */
if (!$captcha) {
    http_response_code(401); // Return error code if there is no captcha
}
$response =     file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=YOUR-SECRET-KEY-HERE&response=" . $captcha);
if ($response . success == false) {
echo ‘SPAM’;
http_response_code(401); // It’s SPAM! RETURN SOME KIND OF ERROR
} else {
// Everything is ok, should output this in json or something better, but this is an example
    echo '[email protected]'; 
}

Ludzie, którzy piszą skrobaki, chcą, aby ich skrobaki były jak najbardziej wydajne. Dlatego nie będą pobierać stylów, skryptów ani innych zasobów zewnętrznych. Nie ma metody, którą znam, aby ustawić mailtolink za pomocą CSS. Ponadto powiedziałeś, że nie chcesz ustawiać linku za pomocą JavaScript.

Jeśli zastanowisz się, jakie są inne typy zasobów, to są też dokumenty zewnętrzne (np. Dokumenty HTML używające ramek iframe). Prawie żaden skrobak nie zawracałby sobie głowy pobieraniem zawartości ramek iframe. Dlatego możesz po prostu zrobić:

index.html:

<iframe src="frame.html" style="height: 1em; width: 100%; border: 0;"></iframe>

frame.html:

My email is <a href="mailto:[email protected]" target="_top">[email protected]</a>

Dla użytkowników element iframe wygląda jak zwykły tekst. Ramki iframe są domyślnie wbudowane i przezroczyste, więc wystarczy ustawić ich obramowanie i wymiary. Nie możesz dopasować rozmiaru elementu iframe do rozmiaru jego zawartości bez użycia JavaScript, więc najlepsze, co możemy zrobić, to nadanie mu wstępnie zdefiniowanych wymiarów.

Po pierwsze, nie sądzę, aby robienie czegokolwiek z CSS zadziałało. Wszystkie boty (z wyjątkiem robota Google) po prostu ignorują wszelkie style w witrynach. Każde rozwiązanie musi działać z JS lub po stronie serwera.

Rozwiązaniem po stronie serwera może być utworzenie <a>odnośnika do nowej karty, która po prostu przekierowuje do żądanego mailto:

To wszystkie moje pomysły na razie. Mam nadzieję, że to pomoże.

Krótka odpowiedź na wszystkie Twoje wymagania brzmi: to niemożliwe

Niektóre z opisanych tutaj opcji opartych na skryptach mogą działać w przypadku niektórych botów, ale nie chciałeś używać skryptu, więc nie, nie możesz.

Rozwiązanie PHP

function printEmail($email){
    $email = '<a href="mailto:'.$email.'">'.$email.'</a>';
    $a = str_split($email);
    return "<script>document.write('".implode("'+'",$a)."');</script>";
}

Posługiwać się

echo printEmail('[email protected]');

Wynik

<script>document.write('<'+'a'+' '+'h'+'r'+'e'+'f'+'='+'"'+'m'+'a'+'i'+'l'+'t'+'o'+':'+'t'+'e'+'s'+'t'+'@'+'g'+'m'+'a'+'i'+'l'+'.'+'c'+'o'+'m'+'"'+'>'+'t'+'e'+'s'+'t'+'@'+'g'+'m'+'a'+'i'+'l'+'.'+'c'+'o'+'m'+'<'+'/'+'a'+'>');</script>

Wymagania PS: użytkownik musi mieć włączoną obsługę JavaScript

Jedyną metodą, którą uznałem za skuteczną, jest użycie go z css, jak poniżej:

<a href="mailto:[email protected]">myemail@<span style="display:none;">ignore-</span>domain.com

a następnie napisz javascript, aby usunąć ignoreme-słowo z href="mailto:..."atrybutu za pomocą wyrażenia regularnego. Spowoduje to ukrycie wiadomości e-mail przed botem, ponieważ doda ignore-słowo przed prawdziwą domeną i będzie działać na czytniku ekranu, a gdy użytkownik kliknie link, funkcja niestandardowego js usunie ignore-słowo z hrefatrybutu, aby otworzyć prawdziwy e-mail.

Ta metoda działa dla mnie bardzo skutecznie do dziś. możesz przeczytać więcej na ten temat - http://techblog.tilllate.com/2008/07/20/ten-methods-to-obfuscate-e-mail-addresses-compared/