⌗ Coston

react-obfuscate ☁️

Travis npm version npm 

🔖Try Me

Inspect and click these robot-resistant, user friendly, contact links

➡️ Phone: 9876-543-210
➡️ Email: looc.notsoc@olleh

<div>
  <h2>🔖Try Me</h2>
  <p>
    Inspect and click these robot-resistant, user friendly, contact links
  </p>
  <p>
    ➡️ Phone: 
    <Obfuscate tel="012-345-6789" />
    <br />
    ➡️ Email:
    <Obfuscate 
      email="hello@coston.cool" 
      headers={{ subject: 'wow' }}
    />
  </p>
</div>

How it works

Pass the contact link as an email, tel, sms, or facetime prop. The component obfuscates href data until an onClick event. Links are given their proper URL schemes (mailto, facetime, etc.) The link is rendered in reverse in the dom, but reversed again with css. This making the link useless for spammers, but user friendly on screen.

Why

The world needs obfuscated links that display the link in a friendly way.

Usage

npm install react-obfuscate --save

Read the complete docs at npm


© 2020 Coston Perkins