Người gửi thư rác ngày nay là một vấn đề rất lớn. Nếu bạn muốn chia sẻ thông tin liên hệ của mình mà không bị quá tải bởi email spam, bạn cần có một giải pháp. Tôi gặp phải vấn đề này một vài tháng trước. Trong khi tôi đang nghiên cứu cách giải quyết nó, tôi đã tìm thấy những giải pháp thú vị khác nhau. Chỉ một trong số họ là hoàn hảo cho nhu cầu của tôi.
Trong bài viết này, tôi sẽ chỉ cho bạn cách dễ dàng bảo vệ địa chỉ email của bạn khỏi chương trình thư rác bằng nhiều giải pháp. Tùy thuộc vào bạn để quyết định kỹ thuật nào phù hợp với nhu cầu của bạn.
Mục lục
Trường hợp truyền thống
Giả sử rằng bạn có một trang web. Bạn muốn chia sẻ chi tiết liên hệ của mình và bạn không muốn chỉ chia sẻ các liên kết xã hội của mình. Địa chỉ email phải ở đó. Dễ dàng, phải không? Bạn gõ một cái gì đó như thế này:
<a href="mailto:[email protected]">Send me an EmailVà sau đó bạn tạo kiểu theo sở thích của mình.
Chà, ngay cả khi giải pháp này hoạt động, nó vẫn có vấn đề. Nó làm cho địa chỉ email của bạn có sẵn cho tất cả mọi người, bao gồm cả trình thu thập dữ liệu trang web và tất cả các loại chương trình thư rác. Điều này có nghĩa là hộp thư đến của bạn có thể tràn ngập hàng tấn rác không mong muốn như khuyến mại hoặc thậm chí một số chiến dịch lừa đảo.
Chúng tôi đang tìm kiếm một thỏa hiệp. Chúng tôi muốn làm cho bot khó lấy được địa chỉ email của chúng tôi, nhưng càng đơn giản càng tốt đối với người dùng bình thường.
Giải pháp là obfuscation.
Obfuscation là thực hành làm cho một cái gì đó khó hiểu. Chiến lược này được sử dụng với mã nguồn vì nhiều lý do. Một trong số đó là che giấu mục đích của mã nguồn để làm cho việc giả mạo hoặc thiết kế ngược trở nên khó khăn hơn. Trước tiên, chúng ta sẽ xem xét các giải pháp khác nhau, tất cả đều dựa trên ý tưởng về obfuscation.
Cách tiếp cận HTML
Chúng ta có thể coi bot như một phần mềm duyệt web và thu thập thông tin qua các trang web. Sau khi bot lấy được tài liệu HTML, nó sẽ diễn giải nội dung trong đó và trích xuất thông tin. Quá trình khai thác này được gọi là rút trích nội dung trang web. Nếu bot đang tìm kiếm một mẫu phù hợp với định dạng email, chúng tôi có thể cố gắng ngụy trang nó bằng cách sử dụng một định dạng khác. Ví dụ: chúng tôi có thể sử dụng các nhận xét HTML:
If you want to get in touch, please drop me an email at [email protected]address.com
Trông có vẻ lộn xộn, nhưng người dùng sẽ thấy địa chỉ email như thế này:
If you want to get in touch, please drop me an email at [email protected]Ưu điểm:
- Dễ dàng cài đặt.
- Nó hoạt động với JavaScript bị vô hiệu hóa.
- Nó có thể được đọc bằng công nghệ hỗ trợ.
Nhược điểm:
- Các bot spam có thể bỏ qua các chuỗi đã biết như nhận xét.
- Nó không hoạt động với một
mailto:liên kết.
Phương pháp tiếp cận HTML & CSS
Điều gì sẽ xảy ra nếu chúng ta sử dụng sức mạnh tạo kiểu của CSS để xóa một số nội dung được đặt chỉ để đánh lừa chương trình thư rác? Giả sử rằng chúng ta có cùng một nội dung như trước đây, nhưng lần này chúng ta đặt một span phần tử bên trong:
If you want to get in touch, please drop me an email at [email protected]address.com
.Sau đó, chúng tôi sử dụng quy tắc kiểu CSS sau:
span.blockspam {
display: none;
}Người dùng cuối cùng sẽ chỉ thấy điều này:
If you want to get in touch, please drop me an email at [email protected]… Đó là nội dung chúng tôi thực sự quan tâm.
Ưu điểm:
- Nó hoạt động với JavaScript bị vô hiệu hóa.
- Các bot lấy được địa chỉ email sẽ khó hơn.
- Nó có thể được đọc bằng công nghệ hỗ trợ.
con:
- Nó không hoạt động với một
mailto:liên kết.
Cách tiếp cận JavaScript
Trong ví dụ này, chúng tôi sử dụng JavaScript để làm cho địa chỉ email của chúng tôi không thể đọc được. Sau đó, khi trang được tải, JavaScript làm cho địa chỉ email có thể đọc lại được. Bằng cách này, người dùng của chúng tôi có thể nhận được địa chỉ email.
Giải pháp đơn giản nhất sử dụng thuật toán mã hóa Base64 để giải mã địa chỉ email. Đầu tiên, chúng ta cần mã hóa địa chỉ email trong Base64. Chúng ta có thể sử dụng một số trang web như Base64Encode.org để làm điều này. Nhập địa chỉ email của bạn như sau:
Sau đó, nhấp vào nút để mã hóa. Với vài dòng JavaScript này, chúng tôi giải mã địa chỉ email và đặt href thuộc tính trong liên kết HTML:
var encEmail = "ZW1haWxAYWRkcmVzcy5jb20=";
const form = document.getElementById("contact");
form.setAttribute("href", "mailto:".concat(atob(encEmail)));Sau đó, chúng tôi phải đảm bảo rằng liên kết email bao gồm id="contact" trong phần đánh dấu, như thế này:
Send me an EmailChúng tôi đang sử dụng atob phương pháp để giải mã một chuỗi dữ liệu được mã hóa Base64. Một giải pháp thay thế là sử dụng một số thuật toán mã hóa cơ bản như Mật mã Caesar, khá đơn giản để triển khai trong JavaScript.
Ưu điểm:
- Việc lấy địa chỉ email của bot sẽ phức tạp hơn, đặc biệt nếu bạn sử dụng thuật toán mã hóa.
- Nó hoạt động với một
mailto:liên kết. - Nó có thể được đọc bằng công nghệ hỗ trợ.
con:
- JavaScript phải được bật trên trình duyệt, nếu không, liên kết sẽ trống.
Phương pháp tiếp cận biểu mẫu nhúng
Các hình thức liên hệ có ở khắp mọi nơi. Bạn chắc chắn đã sử dụng một trong số chúng ít nhất một lần. Nếu bạn muốn một cách để mọi người liên hệ trực tiếp với bạn, một trong những giải pháp khả thi là triển khai dịch vụ biểu mẫu liên hệ trên trang web của bạn.
biểu mẫu là một ví dụ về dịch vụ cung cấp cho bạn tất cả các lợi ích của biểu mẫu liên hệ mà không cần lo lắng về mã phía máy chủ. Wufoo là quá. Trong thực tế, đây là một loạt bạn có thể xem xét để xử lý việc gửi biểu mẫu liên hệ cho bạn.
Bước đầu tiên để sử dụng bất kỳ dịch vụ biểu mẫu nào là đăng ký và tạo một tài khoản. Tất nhiên, giá cả khác nhau, cũng như các tính năng được cung cấp giữa các dịch vụ. Nhưng một điều mà hầu hết họ làm là cung cấp cho bạn một đoạn mã HTML để nhúng biểu mẫu bạn tạo vào bất kỳ trang web hoặc ứng dụng nào. Đây là ví dụ tôi lấy từ biểu mẫu mà tôi đã tạo trong tài khoản Formspring của mình
Trong dòng đầu tiên, bạn nên tùy chỉnh action dựa trên điểm cuối của bạn. Đây là biểu mẫu khá cơ bản, nhưng bạn có thể thêm bao nhiêu trường tùy thích.
Lưu ý thẻ nhập ẩn trên dòng 9. Thẻ nhập này giúp bạn lọc các bài gửi do người dùng thông thường và bot thực hiện. Trên thực tế, nếu back-end của Formspree nhìn thấy một bản đệ trình đã điền đầy đủ thông tin đầu vào, nó sẽ loại bỏ nó. Một người dùng thông thường sẽ không làm điều đó, vì vậy nó phải là một bot.
Ưu điểm:
- Địa chỉ email của bạn an toàn vì nó không công khai.
- Nó hoạt động với Javascript bị vô hiệu hóa.
con:
- Dựa vào dịch vụ của bên thứ ba (có thể là dịch vụ chuyên nghiệp, tùy thuộc vào nhu cầu của bạn)
Có một nhược điểm khác đối với giải pháp này nhưng tôi đã loại nó ra khỏi danh sách vì nó khá chủ quan và nó phụ thuộc vào trường hợp sử dụng của bạn. Với giải pháp này, bạn không chia sẻ địa chỉ email của mình. Bạn đang cung cấp cho mọi người một cách để liên hệ với bạn. Điều gì sẽ xảy ra nếu mọi người muốn gửi email cho bạn? Điều gì sẽ xảy ra nếu mọi người đang tìm kiếm địa chỉ email của bạn và họ không muốn có một biểu mẫu liên hệ? Một biểu mẫu liên hệ có thể là một giải pháp nặng nề trong tình huống đó.
Kết luận
Chúng tôi đã đến cuối cùng! Trong hướng dẫn này, chúng tôi đã nói về các giải pháp khác nhau cho vấn đề chia sẻ email trực tuyến. Chúng tôi đã xem xét các ý tưởng khác nhau, liên quan đến mã HTML, JavaScript và thậm chí một số dịch vụ trực tuyến như Formspree để xây dựng biểu mẫu liên hệ. Ở phần cuối của hướng dẫn này, bạn nên biết tất cả những ưu và nhược điểm của các chiến lược được hiển thị. Bây giờ, bạn có thể chọn cái phù hợp nhất cho trường hợp sử dụng cụ thể của mình.
