Ẩn Địa chỉ Email khỏi Bots - Giữ mailto:

Question 1

tl; dr

Ẩn địa chỉ email khỏi bot mà không cần sử dụng tập lệnh và duy trì mailto:chức năng. Phương pháp cũng phải hỗ trợ trình đọc màn hình.

Tóm lược

Làm xáo trộn email mà không cần sử dụng tập lệnh hoặc biểu mẫu liên hệ
Địa chỉ email cần hiển thị hoàn toàn với người xem và duy trì mailto:chức năng
Địa chỉ Email không được ở dạng hình ảnh .
Địa chỉ email phải được ẩn "hoàn toàn" khỏi trình thu thập thông tin thư rác và chương trình thư rác và bất kỳ loại trình thu thập thông tin nào khác

Hiệu quả mong muốn:

Không có kịch bản , xin vui lòng. Không có tập lệnh nào được sử dụng trong dự án và tôi muốn giữ nguyên như vậy .
Địa chỉ email được hiển thị trên trang hoặc có thể dễ dàng hiển thị sau một số loại tương tác của người dùng, như mở một phương thức.
Người dùng có thể nhấp vào địa chỉ email mà từ đó sẽ kích hoạt mailto:chức năng.
Nhấp vào email sẽ mở ứng dụng email của người dùng.

Nói cách khác, mailto:chức năng phải hoạt động.
Địa chỉ email trong không hiển thị hoặc không được xác định là địa chỉ email đối với bot (Điều này bao gồm nguồn trang)
Tôi không có hộp thư đến chứa đầy thư rác

Điều gì KHÔNG hoạt động

Thêm biểu mẫu liên hệ - hoặc bất kỳ thứ gì tương tự - thay vì địa chỉ email

Tôi ghét các hình thức liên hệ . Tôi hiếm khi điền vào biểu mẫu liên hệ. Nếu không có địa chỉ email, tôi sẽ tìm số điện thoại, và nếu không có, tôi bắt đầu tìm kiếm một dịch vụ thay thế. Tôi sẽ chỉ điền vào một biểu mẫu liên hệ nếu tôi thực sự phải làm.
Thay thế địa chỉ bằng hình ảnh của địa chỉ

Điều này tạo ra một bất lợi LỚN đối với người sử dụng trình đọc màn hình ( hãy nhớ đến người khiếm thị trong các dự án tương lai của bạn )

Nó cũng loại bỏ các mailto:chức năng trừ khi bạn thực hiện các nhấp chuột được hình ảnh và sau đó thêm các mailto:chức năng như các hrefbạn đã liên kết, nhưng điều đó đánh bại mục đích và bây giờ là email được hiển thị cho chương trình.

Những gì có thể hoạt động:

Sử dụng thông minh pseudo-elementstrongCSS
Các giải pháp sử dụng base64mã hóa
Chia nhỏ địa chỉ email và chia nhỏ các phần trên tài liệu sau đó đặt chúng lại với nhau theo một phương thức khi người dùng nhấp vào một nút (Điều này có thể liên quan đến nhiều CSSlớp và việc sử dụng anchor tags)
Thay thế htmlcác thuộc tính quaCSS

@MortezaAsadi đã khéo léo đưa ra khả năng trong các nhận xét bên dưới. Đây là liên kết đến đầy đủ - Bài viết từ năm 2012:

Điều gì sẽ xảy ra nếu chúng ta có thể sử dụng CSS để thay đổi các thuộc tính HTML?
Các giải pháp sáng tạo khác nằm ngoài phạm vi hiểu biết của tôi.

Câu hỏi / bản sửa lỗi tương tự

JavaScript: Bảo vệ địa chỉ email của bạn bằng Joe Maller

(Đây là một bản sửa lỗi tuyệt vời do Joe Maller đề xuất, nó hoạt động tốt nhưng dựa trên kịch bản . Đây là những gì nó trông như thế nào;

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

Mở rộng đoạn mã

Tìm kiếm một hàm obfuscator địa chỉ email chỉ php

(Một giải pháp Clever sử dụng cả hai PHPvà CSSđể đảo ngược email trước tiên bằng PHP, sau đó đảo ngược lại bằng CSS) Một giải pháp rất hứa hẹn Hoạt động tuyệt vời! Nhưng nó quá dễ dàng để giải quyết .
Những ngày này có đáng để làm xáo trộn các địa chỉ email trên web không?

(Sửa lỗi Javascript)
Cách tốt nhất để làm xáo trộn địa chỉ e-mail trên một trang web?

Câu trả lời đã chọn hoạt động . Nó thực sự hoạt động rất tốt. Nó liên quan đến việc mã hóa email dưới dạng html entities. Nó có thể được cải thiện?

Đây là những gì nó trông như thế nào;
```
<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>
```
Mở rộng đoạn mã
Chức năng xáo trộn địa chỉ e-mail có thực sự hoạt động không?

(Câu trả lời được chọn cho câu hỏi SuperUser này rất hay và nó trình bày một nghiên cứu về lượng thư rác nhận được bằng cách sử dụng các phương pháp xáo trộn khác nhau.

Có vẻ như thao tác với địa chỉ email CSSđể làm cho nó rtlhoạt động. Đây là phương pháp tương tự được sử dụng trong câu hỏi đầu tiên tôi liên kết đến trong phần này.

Tôi không chắc việc thêm mailto:chức năng vào bản sửa lỗi sẽ có những ảnh hưởng gì đến kết quả.
Ngoài ra còn có nhiều câu hỏi khác trên SO đều có câu trả lời tương tự. Tôi đã không tìm thấy bất cứ điều gì phù hợp với hiệu ứng mong muốn của tôi

Câu hỏi:

Liệu có thể tăng hiệu quả (tức là càng ít spam càng tốt) của các phương pháp làm xáo trộn email ở trên bằng cách kết hợp hai hoặc nhiều bản sửa lỗi (hoặc thậm chí thêm các bản sửa lỗi mới) trong khi:

A- Duy trì mailto:chức năng; và

B- Hỗ trợ trình đọc màn hình

Biên tập:

Nhiều câu trả lời và nhận xét bên dưới đặt ra một câu hỏi rất hay trong khi chỉ ra rằng không thể làm điều này mà không có một số loạijs

Câu hỏi được hỏi / ngụ ý là:

Tại sao không sử dụng js?

Câu trả lời là tôi bị dị ứng với js

Đùa sang một bên,

Ba lý do chính tôi hỏi câu hỏi này là:

Biểu mẫu liên hệ ngày càng được chấp nhận nhiều hơn để thay thế cho việc cung cấp địa chỉ email - điều mà chúng không nên làm.
Nếu nó có thể được thực hiện mà không cần script thì nó nên được thực hiện mà không cần script.
Sự tò mò: (vì thực tế tôi đang sử dụng một trong các jsbản sửa lỗi hiện tại) Tôi muốn xem liệu thảo luận về vấn đề này có dẫn đến cách làm tốt hơn không.

Question 2

Vấn đề với yêu cầu của bạn cụ thể là "Hỗ trợ trình đọc màn hình", vì theo định nghĩa, trình đọc màn hình là một "bot". Nếu trình đọc màn hình cần có khả năng diễn giải địa chỉ email, thì trình thu thập thông tin trang cũng có thể giải thích nó.

Ngoài ra, điểm của mailtothuộc tính là trở thành tiêu chuẩn về cách thực hiện các địa chỉ email trên web. Hỏi liệu có cách thứ hai để làm điều đó hay không là hỏi liệu có tiêu chuẩn thứ hai không.

Thực hiện điều đó thông qua các tập lệnh sẽ vẫn gặp vấn đề giống như khi trang được tải, tập lệnh sẽ được chạy và địa chỉ email được hiển thị trong DOM (trừ khi bạn điền địa chỉ email on clickhoặc thứ gì đó). Dù bằng cách nào, trình đọc màn hình sẽ vẫn gặp sự cố với điều này vì nó chưa được tải.

Thành thật mà nói, chỉ cần nhận được một dịch vụ email với một bộ lọc thư rác tốt và chỉ định một dòng chủ đề mặc định để bạn dễ dàng sắp xếp trong hộp thư đến của mình.

<a href="mailto:no-one@no-where.com?subject=Something to filter on">Email me</a>

Những gì bạn đang yêu cầu là nếu tiêu chuẩn có hai cách để thực hiện điều gì đó, một cho bot và một cho không phải bot. Câu trả lời là không, và bạn phải chiến đấu với những con bot tốt nhất có thể.

Question 3

Đánh bại chương trình email là một việc khó khăn. Bạn có thể muốn xem phần các biện pháp đối phó Thu thập Địa chỉ Email trên Wikipedia.

Câu chuyện phía sau của tôi là tôi đã viết một bot tìm kiếm. Nó đã thu thập hơn 105.000 URL trong lần chạy đầu tiên nhiều năm trước. Từ những gì tôi học được từ việc làm đó là các chương trình thu thập dữ liệu web thực sự thấy MỌI THỨ là văn bản, xuất hiện trên một trang web. Bots đọc mọi thứ ngoại trừ hình ảnh.

Không thể dễ dàng ngăn chặn thư rác thông qua mã vì những lý do sau:

CSS & JS không liên quan khi sử dụng thẻ mailto:. Bots đặc biệt xem xét các trang HTML cho từ khóa "mailto:" đó. Mọi thứ từ dấu hai chấm đó đến dấu ngoặc kép tiếp theo (tùy điều kiện nào đến trước) được xem như một địa chỉ email. Địa chỉ email thực thể HTML - như ví dụ trên - có thể được dịch nhanh chóng bằng cách sử dụng hàm / phương thức ASCII ngược. Chạy đoạn mã JavaScript ở trên, nhanh chóng chuyển chuỗi bắt đầu bằng: & # 121; & # 111; & # 117; & # 114; ... thành ... "yourname@domain.com". (Bot tìm kiếm của tôi đã loại bỏ các hrefs với địa chỉ mailto: email, vì tôi muốn URL cho các trang web chứ không phải địa chỉ email.)
Nếu một trang gặp sự cố với bot, tác giả của bot sẽ điều chỉnh bot để khắc phục sự cố với trang đó, để bot sẽ không gặp sự cố tại trang đó nữa trong tương lai. Do đó, làm cho bot của họ thông minh hơn.
Tác giả bot có thể viết bot, tạo ra tất cả các biến thể đã biết của địa chỉ email ... mà không cần thu thập dữ liệu trang và không bao giờ sử dụng bất kỳ địa chỉ email bắt đầu nào. Mặc dù có thể không khả thi để làm điều đó, nhưng điều đó không phải là không tưởng với các CPU số lõi cao ngày nay (siêu phân luồng và chạy ở tốc độ 4+ GHz), cộng với khả năng sử dụng điện toán đám mây phân tán và thậm chí cả các siêu máy tính. Có thể tưởng tượng được rằng ai đó bây giờ có thể tạo một trang trại bot để spam mọi người mà không cần biết địa chỉ email của bất kỳ ai. 20 năm trước, điều đó thật không thể hiểu nổi.
Các nhà cung cấp email miễn phí đã có lịch sử bán tài khoản người dùng miễn phí cho các nhà quảng cáo của họ. Trước đây, chỉ cần đăng ký một tài khoản email miễn phí đã tự động đảm bảo cho họ bật đèn xanh để bắt đầu gửi thư rác đến địa chỉ email đó ... mà không cần sử dụng địa chỉ email đó trực tuyến. Tôi đã thấy điều đó xảy ra nhiều lần, với những tên công ty nổi tiếng. (Tôi sẽ không đề cập đến bất kỳ cái tên nào.)
Từ khóa mailto: là một phần của IETF RFC này , nơi các trình duyệt được xây dựng để tự động khởi chạy các ứng dụng email khách mặc định, từ các liên kết có từ khóa đó trong đó. JavaScript phải được sử dụng để làm gián đoạn quá trình khởi chạy ứng dụng đó, khi nó xảy ra.

Tôi không nghĩ rằng có thể ngăn chặn 100% thư rác khi sử dụng máy chủ email truyền thống mà không cần sử dụng bộ lọc trên máy chủ email và có thể sử dụng hình ảnh.

Có một giải pháp thay thế ... Bạn cũng có thể xây dựng ứng dụng email khách giống như trò chuyện, chạy nội bộ trên một trang web. Nó sẽ giống như ứng dụng trò chuyện của Facebook. Nó "giống như email", nhưng không thực sự là email. Nó chỉ đơn giản là nhắn tin nhanh 1-1 với tính năng lưu trữ ... tự động tải khi đăng nhập. Vì nó có tính năng đính kèm tài liệu + liên kết, nó hoạt động giống như email ... nhưng không có thư rác. Miễn là bạn không xây dựng một API có thể truy cập bên ngoài, thì đó là một hệ thống đóng, nơi mọi người không thể gửi thư rác vào đó.

Nếu bạn định gắn bó với email truyền thống, thì cách tốt nhất của bạn có thể là chạy thứ gì đó như SpamAssassin của Apache trên máy chủ email của công ty.

Bạn cũng có thể thử kết hợp nhiều chiến lược như đã liệt kê ở trên, để giúp người thu thập email khó thu thập địa chỉ email từ các trang web của bạn hơn. Họ sẽ không ngăn chặn 100% thư rác, 100% thời gian ... đồng thời cho phép 100% trình đọc màn hình hoạt động cho những khách truy cập mù.

Bạn đã tạo ra một cái nhìn khởi đầu thực sự tốt về những gì sai với email truyền thống! Kudo cho bạn vì điều đó!

Một trình đọc màn hình tốt là JAWS từ Freedom Scientific . Tôi đã sử dụng nó trước đây để lắng nghe người dùng khiếm thị đọc các trang web của tôi như thế nào. (Nếu bạn nghe thấy giọng nam đọc cả hai hành động [như nhấp vào liên kết] và văn bản, hãy thử thay đổi 1 giọng nói thành nữ để 1 giọng đọc hành động và một giọng nói khác đọc văn bản. Điều đó giúp bạn dễ dàng nghe cách đọc trang web hơn hiển thị rõ ràng.)

Chúc may mắn với những nỗ lực đối phó Thu hoạch Địa chỉ Email của bạn !

Question 4

Đây là một cách tiếp cận sử dụng JavaScript, nhưng với một bản in khá nhỏ. Nó cũng rất "ghetto", và nói chung tôi sẽ không đề xuất cách tiếp cận với JS nội tuyến trong HTML ngoại trừ bạn cực kỳ miễn cưỡng sử dụng 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>

Mở rộng đoạn mã

data-contactlà địa chỉ email được mã hóa base64. Và, data-subjlà một chủ đề được mã hóa base64 tùy chọn.

Thách thức chính khi làm điều này mà không có JS là CSS không thể thay đổi các thuộc tính HTML. ( Bài viết bạn đã liên kết là một suy ngẫm "trên trời dưới đất" và không liên quan đến những gì có thể xảy ra hôm nay hoặc trong tương lai gần.)

Phương pháp tiếp cận thực thể HTML mà bạn đã đề cập, hoặc một số biến thể của nó, có thể là tùy chọn đơn giản nhất nhưng sẽ có một số hiệu quả. Ngoài ra, iframecách tiếp cận thông minh và cách tiếp cận chuyển hướng máy chủ khá tuyệt vời. Tuy nhiên, cả ba đều dễ bị bot:

Các thực thể HTML chỉ cần được chuyển đổi (và việc phát hiện điều đó rất đơn giản)
Tài liệu được tham chiếu bởi iframe có thể đơn giản được theo sau
Chuyển hướng máy chủ cũng có thể được theo sau

Với cách tiếp cận được nêu ở trên, việc sử dụng địa chỉ email được mã hóa base64 trong một data-contactthuộc tính là rất "một lần" - miễn là trình quét không được thiết kế đặc biệt cho trang web của bạn, nó sẽ hoạt động.

Question 5

Đơn giản + Nhiều @ + Có thể chỉnh sửa mà không cần công cụ

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

Mở rộng đoạn mã

Question 6

Bạn đã cân nhắc sử dụng mailhide recaptcha của google chưa? https://www.google.com/recaptcha/admin#mailhide

Ý tưởng là khi người dùng nhấp vào hộp kiểm ( xem nocaptcha bên dưới ), địa chỉ e-mail đầy đủ sẽ được hiển thị.

Mặc dù recaptcha theo truyền thống không chỉ khó đối với trình đọc màn hình mà còn cả con người, với vai trò của nocaptcha recaptcha của google mà bạn có thể đọc ở đây vì chúng liên quan đến các bài kiểm tra khả năng truy cập. Nó dường như thể hiện lời hứa liên quan đến trình đọc màn hình vì nó hiển thị như một hộp kiểm truyền thống từ chế độ xem của họ.

Ví dụ số 1 - Không an toàn nhưng để minh họa ý tưởng dễ dàng

Dưới đây là một số mã làm ví dụ mà không sử dụng mailhide nhưng tự thực hiện một cái gì đó bằng cách sử dụng 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@something.com";
}

Lưu ý: Trong ví dụ của tôi, tôi có e-mail trong một hàm javascript. Tốt nhất là bạn nên xác thực lại mã xác nhận ở đầu máy chủ và gửi lại e-mail, nếu không, bot có thể lấy nó trong mã.

Ví dụ # 2 - Xác thực phía máy chủ và trả lại e-mail

Nếu chúng tôi sử dụng một ví dụ tương tự hơn, chúng tôi sẽ nhận được thêm tính bảo mật: 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!");
}
});

Veri.php ở đâu:

$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&amp;amp;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@something.com'; 
}

Question 7

Những người viết giấy nháp muốn làm cho máy cạo của họ hiệu quả nhất có thể. Do đó, họ sẽ không tải xuống các kiểu, tập lệnh và các tài nguyên bên ngoài khác. Không có phương pháp nào mà tôi biết để đặt mailtoliên kết bằng CSS. Ngoài ra, bạn đặc biệt nói rằng bạn không muốn đặt liên kết bằng Javascript.

Nếu bạn nghĩ về các loại tài nguyên khác có, thì cũng có các tài liệu bên ngoài (tức là các tài liệu HTML sử dụng iframe). Hầu như không có người cắt nào bận tâm tải xuống nội dung của iframe. Do đó, bạn chỉ cần làm:

index.html:

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

frame.html:

My email is <a href="mailto:me@example.com" target="_top">me@example.com</a>

Đối với người dùng con người, iframe trông giống như văn bản bình thường. Iframe là nội tuyến và trong suốt theo mặc định, vì vậy chúng ta chỉ cần đặt đường viền và kích thước của nó. Bạn không thể làm cho kích thước của iframe phù hợp với kích thước nội dung của nó mà không sử dụng Javascript, vì vậy, điều tốt nhất chúng tôi có thể làm là cung cấp cho nó các kích thước được xác định trước.

Question 8

Đầu tiên, tôi không nghĩ rằng làm bất cứ điều gì với CSS sẽ hiệu quả. Tất cả các bot (ngoại trừ trình thu thập thông tin của Google) chỉ đơn giản là bỏ qua mọi kiểu dáng trên các trang web. Bất kỳ giải pháp nào cũng phải hoạt động với JS hoặc phía máy chủ.

Một giải pháp phía máy chủ có thể là tạo một <a>liên kết đến một tab mới, tab này chỉ đơn giản là chuyển hướng đến mailto:

Đó là tất cả những ý tưởng của tôi lúc này. Hy vọng nó giúp.

Question 9

Câu trả lời ngắn gọn để đáp ứng mọi yêu cầu của bạn là không thể

Một số tùy chọn dựa trên tập lệnh được trả lời ở đây có thể hoạt động đối với một số bot nhất định, nhưng bạn muốn không có tập lệnh, vì vậy, không, bạn không thể.

Question 10

Giải pháp PHP

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

Sử dụng

echo printEmail('test@gmail.com');

Kết quả

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

Yêu cầu PS: người dùng phải bật JavaScript

Question 11

Một phương pháp tôi thấy hiệu quả là sử dụng nó với css như dưới đây:

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

và sau đó viết javascript để xóa ignoreme-từ đó khỏi href="mailto:..."thuộc tính bằng regex. Thao tác này sẽ ẩn email khỏi bot vì nó sẽ nối ignore-từ trước miền thực và điều này sẽ hoạt động trên trình đọc màn hình và khi người dùng nhấp vào liên kết, hàm js tùy chỉnh sẽ xóa ignore-từ khỏi hrefthuộc tính để nó sẽ mở email thực.

Phương pháp này đã hoạt động rất hiệu quả đối với tôi cho đến nay. bạn có thể đọc thêm về điều này - http://techblog.tilllate.com/2008/07/20/ten-methods-to-obfuscate-e-mail-addresses-compared/