Can spam robots read client-side rendered content?

Question

I would like to hide my email links from spam robots with React.js. My idea is to put the email link into a <div> that only gets rendered when someone clicks a trigger button (like a dropdown). It is therefore only client-side rendered (so at least Google crawlers should not be able to read it).

Furthermore, the link's component (that will be the children of the dropdown component) would look like this:

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;

This way I try to protect the rendered email address with an extra rendering iteration.

The user-readable text of the link would be put together using SASS:

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

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

What do you think of my solution? Is this defense plan is effective enough against spam robots? Am I missing something? Is there anything I could improve to increase the protection?

Thanks in advance

Anything can be bypassed if the scraper is designed intelligently enough, unfortunately — CertainPerformance, Nov 04 '20 at 20:46

score 1 · Answer 1 · answered Nov 04 '20 at 20:57

The generic scraper will probably not "click" on every button in the UI, so that could work, but they could grab all the attribute-values and parse them as emails - for example.

A quick solution is to store the email obfuscated in the attribute, and transform it on click.

You can look into email obfuscation, but have in mind that there are many opinions and articles with different opinions: Best way to obfuscate an e-mail address on a website?

Can spam robots read client-side rendered content?

1 Answers1