Send E-mails in javascript with SMTP.JS(Detailed Guide)

Hamza Farooq
3 min readMar 16, 2021

Update: SMTP.JS has reduced functionality to allow elastic mail SMTP only. They no longer support Gmail SMTP.

In this guide, I will be telling you about sending e-mails with JavaScript specifically using the Gmail SMTP server.

1 In order to use Gmail SMTP, you need to configure your Gmail. You need to change some settings of your Gmail account from which you want to send the mail.

  • Enable 2-step verification
  • Generate Application-specific password

Enable 2-step verification:

This step is easy. Just go to Google Account, login if you are not Logged in. Then go to security and enable 2-step verification.

Google 2-step verification screen

Generate Application-specific password:

Now click on App passwords.

Google App passwords screen

Then click Select app dropdown and select other(Custom name)

Generate app password screen

Then write some name and click Generate. After that copy the generated password. (we will use this password later in javascript)

2Now go to the smtp.js website and scroll down to Security part.

Click on the Encrypt your SMTP Credentials button and then fill in the necessary information.

SMTP Host: smtp.gmail.com
SMTP Username: “your google email”
SMTP Password: “paste the password that we generated earlier”
Domain: gmail.com
Port: 25

Then click Generate security token and copy the generated token.

3After this just create an Html file and include the smtp.js script tag in it.

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

For testing, we will create a button, and clicking on it will send an email.

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

Add the below script to your code.

Email.send({
SecureToken : "<paste security token that we just generated>",
To : 'them@website.com',
From : "<your google email>",
Subject : "This is the subject",
Body : "And this is the body"
}).then(
message => alert(message)
);

Here is an example code of a complete HTML file

<!DOCTYPE html>
<html>
<head>
<title>Sending Email</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 gmail>",
Subject: "Testing Email using javascript",
Body: "If you are reading this, dont forget to applaud"
})
.then(function (message) {
alert("Email successfully sent")
});
}
</script>
</head>
<body>
<form method="post">
<input type="button" value="Send Mail"onclick="sendMail()" />
</form>
</body>
</html>

You can also implement this script in Contact Us form for receiving visitor’s queries. Also, your credentials are secured because you are using a security token instead of SMTP credentials.

Don’t forget to Applaud 👏 👏

--

--

Hamza Farooq

Java Developer at Evamp & Saanga. Willing to learn and teach. Playing football to be in Shape.