Html 隐藏来自机器人程序的电子邮件地址-保留邮件收件人： tl；博士

在不使用脚本的情况下隐藏机器人程序的电子邮件地址，并维护

mailto:

功能。方法还必须支持屏幕阅读器

---

总结

• 电子邮件不使用脚本或联系表单进行模糊处理

• 电子邮件地址需要对人类查看者完全可见，并维护

  mailto:

  功能

• 电子邮件地址不得采用图像形式

• 电子邮件地址必须对垃圾邮件爬虫和垃圾邮件机器人“完全”隐藏和任何其他收割机类型

---

预期效果：

• 请不要使用脚本。项目中没有使用脚本，我希望保持这种方式

• 电子邮件地址要么显示在页面上，要么在某种用户交互（如打开模式）后可以轻松显示

• 用户可以单击电子邮件地址，这反过来会触发

  mailto:

  功能

• 单击电子邮件将打开用户的电子邮件应用程序
  换句话说，

  mailto:

  功能必须工作

• 中的电子邮件地址不可见或未标识为发送给机器人的电子邮件地址（包括页面来源）

• 我没有一个装满垃圾邮件的收件箱

---

什么不起作用

• 添加一个联系方式-或任何类似的方式-而不是电子邮件地址
  我讨厌联系方式。我很少填写联系表。如果没有电子邮件地址，我会查找电话号码，如果没有，我会开始寻找其他服务。我只会在绝对必要的情况下填写一份联系表

• 用地址的映像替换地址
  这给使用屏幕阅读器的人造成了一个巨大的不利条件（请记住你未来项目中的视力受损者）
  它还删除

  mailto:

  功能，除非您使图像可点击，然后将

  mailto:

  功能添加为链接的

  href

  ，但是没有达到目的，现在该电子邮件对机器人可见

---

可能有效的方法：

• 在

  CSS

• 使用

  base64

  编码的解决方案

• 将电子邮件地址拆分，并将各个部分分散到文档中，然后在用户单击按钮时以模式将它们重新组合在一起（这可能涉及多个

  CSS

  类和

  锚定标记的使用）
  

• 通过

  CSS

  @莫特扎萨迪在下面的评论中优雅地提出了这种可能性。这是全文的链接-文章来自2012年：

• 其他超出我知识范围的创造性解决方案

---

类似的问题/修复

（这是Joe Maller提出的一个很好的修复方案，虽然效果很好，但它是基于脚本的

电子邮件='emailserver.com'
emailE=（'yourname'+'@'+emailE）
文件。写入（“”）
受JavaScript保护的电子邮件地址

您的请求的问题特别是“支持屏幕阅读器”，因为根据定义，屏幕阅读器是某种“机器人”。如果屏幕阅读器需要能够解释电子邮件地址，那么页面爬虫也可以解释它

另外，

mailto

属性的要点是如何在web上创建电子邮件地址的标准。询问是否有第二种方法可以做到这一点就是询问是否有第二种标准

通过脚本执行此操作仍会遇到与加载页面后相同的问题，脚本将运行并在DOM中呈现电子邮件地址（除非单击或其他内容填充电子邮件地址）。无论哪种方式，屏幕阅读器仍会遇到此问题，因为尚未加载

老实说，只需获得一个带有半标准垃圾邮件过滤器的电子邮件服务，并指定一个默认主题行，以便您在收件箱中轻松排序即可

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

---

你要问的是，该标准是否有两种方法可以做一些事情，一种是针对机器人，另一种是针对非机器人。答案是没有，你必须尽你所能与机器人作战。

编写scraper的人希望使他们的scraper尽可能高效。因此，他们不会下载样式、脚本和其他外部资源esources。据我所知，没有使用CSS设置

mailto

链接的方法。此外，您明确表示不希望使用Javascript设置链接

如果你想一想还有哪些其他类型的资源，还有外部文档（即使用iFrame的HTML文档）。几乎没有刮刀会费心下载iFrame的内容。因此，你可以简单地执行以下操作：

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>

我的电子邮件是

---

对于人类用户来说，iframe看起来就像普通文本。默认情况下，iframe是内联的和透明的，因此我们只需要设置其边框和尺寸。如果不使用Javascript，您无法使iframe的大小与其内容的大小相匹配，因此我们所能做的最好的事情就是为其提供预定义的尺寸。

击败电子邮件机器人是一件困难的事情。您需要你想看看维基百科上的

我的背景故事是我写了一个搜索机器人。它在许多年前的初始运行期间爬网了105000多个URL。从中我学到的是，网络爬网机器人可以看到我看到的一切

<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";
}

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!");
}
});

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

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