hyperlink mailto button

3

I have an HTML hyperlink to send mail through mailto: <a href="mailto:[email protected]?Subject=Hello%20again" target="_top">Send Mail</a>

The problem is that in the source code it is possible to visualize the mail. How can I change to a button to not see the mail.

    
asked by anonymous 13.08.2015 / 13:11

4 answers

3

One possible solution is to use Javascript :

document.getElementById('sendmail').addEventListener('click', function(event){
  event.preventDefault();
    document.location.href = 'mailto:[email protected]';
});
<button id="sendmail">Send</button>

Same thing with jQuery :

$('#sendmail').on('click', function(event){
  event.preventDefault();
    document.location.href = 'mailto:[email protected]';
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script><buttonid="sendmail">Send</button>

Now, if the problem is not to display the email in the source code, the solution is to make a request via AJAX:

PHP File:

<?php

   if($logado)
      exit(json_encode('email'=>'[email protected]');

Javascript:

$('#sendmail').on('click', function(event){
  event.preventDefault();
    $.ajax({
      url: 'email.php',
      dataType: 'json',
      success: function(data){
        document.location.href = 'mailto:' + data.email;
      }
    });
});

So the email will not be visible in the source, but nothing prevents the user from accessing the email.php page and viewing the email. You can do security checks, but it would be meaningless, because from the moment the user clicks the button, he will have access to the email. This can be a good solution against spam robots, just that.

    
13.08.2015 / 13:31
2

In Javascript and HTML , the information will be available for viewing via source code. It would be necessary to use some other language ( PHP , for example), and to pass the information via POST.

    
13.08.2015 / 13:16
2

I just do not understand why the secrecy, when the user clicks will open the default email manager with the email, but it follows a code so that when you move the mouse under the button the link will not appear

<form action="mailto:[email protected]" method="GET">
    <input name="subject" type="text" />
    <textarea name="body"></textarea>
    <input type="submit" value="Send" />
</form>

Benchmark:

  

link

You can trigger email using phpMailer link

  • In this case the source code would be hidden and the secrecy of the email would be preserved.
13.08.2015 / 13:17
1

As Sneeps pointed out very well, when the user clicks he will see the email.

But I believe your problem is not to expose your email to a page user, but to Bots that collect email for spam.

In this case you can confuse these bots by shuffling things up a bit. One way to do this is to transform the email into a base64 string, and for this we can use the following functions

var encodeBase64 = function (string) {
    var bytes = string.split("").map(function (char) {
        return char.charCodeAt(0);
    });
    return btoa(bytes);
}

var decodeBase64 = function (base64) {
    var bytes = atob(base64).split(",").map(function (number) {
        return parseInt(number);
    });
    return String.fromCharCode.apply(String, bytes)
}

Here is an example of the encode of your email:

var encodeBase64 = function (string) {
    var bytes = string.split("").map(function (char) {
        return char.charCodeAt(0);
    });
    return btoa(bytes);
}

document.getElementById("base64Prefixo").textContent = encodeBase64("mailto:");
document.getElementById("base64Email").textContent = encodeBase64("[email protected]");
<label id="base64Prefixo" ></label>
<label id="base64Email" ></label>

Now a second example with a link for sending the email, note that I put the base64 string we just got as a custom date.

var prefixo = "MTA5LDk3LDEwNSwxMDgsMTE2LDExMSw1OA=="
var inputsEmail = document.querySelectorAll("[data-email]");

var decodeBase64 = function (base64) {
  var bytes = atob(base64).split(",").map(function (number) {
    return parseInt(number);
  });
  return String.fromCharCode.apply(String, bytes)
}

var sendEmail = function (event) {
  location.href = decodeBase64(prefixo) + decodeBase64(this.dataset.email);
}

inputsEmail = [].slice.apply(inputsEmail);
inputsEmail.forEach(function (inputEmail) { 
  inputEmail.addEventListener("click", sendEmail)
});
<a id="sendMail" href="#" data-email="MTE1LDExMSwxMDksMTAxLDExMSwxMTAsMTAxLDY0LDEwMSwxMjAsOTcsMTA5LDExMiwxMDgsMTAxLDQ2LDk5LDExMSwxMDk=" >Enviar Email</a>                                    
13.08.2015 / 14:10