垃圾邮件机器人可以读取客户端呈现的内容吗？

问题描述

我想使用React.js隐藏来自垃圾邮件机器人的电子邮件链接。我的想法是将电子邮件链接放入<div>中，该链接仅在有人单击触发按钮（如下拉菜单）时才会呈现。因此，它仅是客户端渲染的（因此至少Google搜寻器不应该能够读取它）。

此外，链接的组件（将是下拉组件的子组件）将如下所示：

import React,{ useState,useEffect } from 'react';
import PropTypes from 'prop-types';
import './styles.scss';

const LinkEmail = ({ user,domain,tld }) => {
  const [finalLink,setFinalLink] = useState('');

  useEffect(() => {
    setFinalLink(`mailto:${user}@${domain}.${tld}`);
  },[]);

  return (
    <a
      href={finalLink}
      className='link-email'
      data-user={user}
      data-domain={domain}
      data-tld={tld}
    />
  );
}

LinkEmail.propTypes = {
  user: PropTypes.string.isrequired,domain: PropTypes.string.isrequired,tld: PropTypes.string.isrequired,};

export default LinkEmail;

这样，我尝试通过额外的渲染迭代来保护渲染的电子邮件地址。

链接的用户可读文本将使用SASS放在一起：

.link-email {
  &:before {
    content: attr(data-user) "@";
  }

  &:after {
    content: attr(data-domain) "." attr(data-tld);
  }
}

您如何看待我的解决方案？这个防御计划对垃圾邮件机器人是否足够有效？我想念什么吗？有什么我可以改善以增加保护的东西吗？

预先感谢

解决方法

通用刮板可能不会在用户界面中的每个按钮上“单击”，因此可以使用，但是它们可以获取所有属性值并将其解析为电子邮件（例如）。

一种快速的解决方案是将混淆的电子邮件存储在属性中，并在单击时进行转换。

您可以调查电子邮件混淆，但是请记住，有很多意见和不同意见的文章： Best way to obfuscate an e-mail address on a website?