Send E-mails with SMTP.JS 😉

4 min readOct 15, 2020

In this tutorial, I will be telling you about sending e-mails with JavaScript.

We will learn how to send mail using Simple Mail Transfer Protocol which is a free JavaScript library. It is basically used to send emails, so it only works for outgoing emails. To be able to send emails, you need to provide the correct SMTP server when you set up your email client. Most of the internet systems use SMTP as a method to transfer mail from one user to another. It is a push protocol. In order to use SMTP, you need to configure your Gmail. You need to change two settings of your Gmail account from which you are sending the mail i.e.

Revoke 2-step verification
Enabling less secure apps to access Gmail, by clicking here.

After this just create a html file and include SMTP in your <script></script> tag :

<script src="https://smtpjs.com/v3/smtp.js"></script>

2. Now, we will create a button, on clicking the mail will be sent.

<form method="post"><input type="button" value="Send Email"onclick="sendEmail()" /></form>

Now, Visit SMTP.JS website.

Scroll down, you will see some codes written over there:-

3. Save the second code, we will use it for sending E-mails

Email.send({
    Host : "smtp.yourisp.com",
    Username : "username",
    Password : "password",
    To : 'them@website.com',
    From : "you@isp.com",
    Subject : "This is the subject",
    Body : "And this is the body"
}).then(
  message => alert(message)
);

4. Click on Setup an SMTP server.
Fill up the details and goto the SMTP dashboard and verify your account.

5. Goto My Account followed by Setting and select the SMTP option there.

6. Click Create SMTP credentials.

7. You will land up with all the necessary information, as shown below

8. Now scrolling down on this website, you will find:-

9. Now, we will encrypt our credentials as it was exposed on the above code.

10. Click on Encrypt your SMTP Credentials.

11. Fill the required information:-

12. Click on Generate Security Token, you will get a token, save it.

13. Now, the code for sending E-mail:-

Email.send({
    SecureToken : "<your security token>",
    To : '<whom you want to send>',
    From : "<Your email id registered on SMTPJS>",
    Subject : "This is the subject",
    Body : "And this is the body"
}).then(
  message => alert("mail has been sent sucessfully")
);

14. Writing all the codes collectively in a single HTML file

<!DOCTYPE html>
<html>
<head>
<title>Sending Mail</title>
<script src="https://smtpjs.com/v3/smtp.js"></script>
<script type="text/javascript">
function sendEmail() {
Email.send({
SecureToken : "<your security token>",
To : '<whom you want to send>',
From : "<Your email id registered on SMTPJS>",
Subject: "Sending Email using javascript with SMTPJS",
Body: "If you are reading this, dont forget to applaud kaustubh72",
Attachments: [{
name: "File_Name_with_Extension",
path: "Full Path of the file"
}]
})
.then(function (message) {
alert("Mail has been sent successfully")
});
}
</script>
</head>
<body>
<form method="post">
<input type="button" value="Send Mail"onclick="sendMail()" />
</form>
</body>
</html>

You can use the above code to send files with attachment.

15. Run the Code and you are done with the automated e-mail service.
Just click on the button and the mail will be sent.
You will see below pop-up if the mail has been sent successfully.

Later you can also implement this script in Contact Us form for receiving visitor’s query. 😄

Don't forget to Applaud 👏 👏, follow me on GitHub 😁 and medium 👱

Send E-mails with SMTP.JS 😉

Written by Bruteforce