Send Email over SSL/TLS in JavaScript from Windows Store Apps - HTML5 - UWP¶

In previous section, I introduced the basic things of email sending in JavaScript. In this section, I will introduce the SSL connection.

Sections:

SSL and TLS Introduction
TLS 1.2
[JavaScript Exmaple - SSL/TLS Setting]
[JavaScript - Send email over direct SSL on 465 port]
[JavaScript - Send email over TLS on 25 or 587 port]

SSL and TLS Introduction¶

SSL connection encrypts data between the SMTP component and SMTP server to protects user, password and email content in TCP/IP level. Now this technology is commonly used and many SMTP servers are deployed with SSL such as Gmail, Yahoo and Hotmail. There are two ways to deploy SSL on SMTP server:

Explicit SSL (TLS)

Using STARTTLS command to switch SSL channel on normal SMTP port (25 or 587);
Implicit SSL

Deploying SSL on another port (465 or other port, you may query it from your server administrator

EASendMail SMTP component supports both ways. The connection can be specified by EASendMail.SmtpConnectType enumeration.

TLS 1.2¶

TLS is the successor of SSL, more and more SMTP servers require TLS 1.2 encryption now.

If your operating system is Windows XP/Vista/Windows 7/Windows 2003/2008/2008 R2/2012/2012 R2, and you got connection error with SSL/TLS connection, you need to enable TLS 1.2 protocol in your operating system like this:

Enable TLS 1.2 on Windows XP/Vista/7/10/Windows 2008/2008 R2/2012

[JavaScript Exmaple - SSL/TLS Setting]¶

//send email by normal TCP/IP without SSL connection
var oServer = new EASendMail.SmtpServer("localhost 25");
oServer.connectType = EASendMail.SmtpConnectType.connectNormal;

//send email by SSL connection with STARTTLS command switching
var oServer = new EASendMail.SmtpServer("localhost 25");
oServer.connectType = EASendMail.SmtpConnectType.connectSTARTTLS;

//send email by SSL connection with direct SSL.
var oServer = new EASendMail.SmtpServer("localhost 465");
oServer.connectType = EASendMail.SmtpConnectType.connectDirectSSL;

//send email by SSL connection with auto-detect.
//if port is 25, STARTTLS SSL will be used; otherwise direct SSL will be used.

var oServer = new EASendMail.SmtpServer("localhost 465");
oServer.connectType = EASendMail.SmtpConnectType.connectSSLAuto

var oServer = new EASendMail.SmtpServer("localhost 25");
oServer.connectType = EASendMail.SmtpConnectType.connectSSLAuto

Note

Remarks: All of samples in this section are based on first section: Send email in A simple JavaScript HTML5 Windows Store App project. To compile and run the following example codes successfully, please click here to learn how to create the test project and add reference of EASendMail to your project.

[JavaScript - Send email over direct SSL on 465 port]¶

The following example codes demonstrate how to use EASendMail SMTP component to send email with direct SSL connection on 465 port.

Note

To get the full sample projects, please refer to Samples section.

(function () {
    "use strict";
    var appViewState = Windows.UI.ViewManagement.ApplicationViewState;
    var ui = WinJS.UI;
    var htmlinited = false;
    var editor;
    var asynCancel = null;
    var m_atts = new Array();
    ui.Pages.define("/default.html", {
        // This function is called whenever a user navigates to this page. It
        // populates the page elements with the app's data.
        ready: function (element, options) {
            init_gui();
        },

        unload: function () {

        }

    });

    function init_gui() {

        // add OnClick event handler
        var btn = document.getElementById("btnSend");
        btn.addEventListener("click", send_email, false);
    }

    function send_email() {
        var result = "";

        var oMail = new EASendMail.SmtpMail("TryIt");

        // Set sender email address, please change it to yours
        oMail.from = new EASendMail.MailAddress("test@emailarchitect.net");

        // Add recipient email address, please change it to yours
        oMail.to.add(new EASendMail.MailAddress("support@emailarchitect.net"));

        // Set email subject
        oMail.subject = "test email from JavaScript HTML5 project";

        // Set email body
        oMail.textBody = "this is a test email sent from Windows Store App using SSL";

        // Your SMTP server address
        var oServer = new EASendMail.SmtpServer("smtp.emailarchitect.net");

        // User and password for ESMTP authentication
        oServer.user = "test@emailarchitect.net";
        oServer.password = "testpassword";

        // Enable SSL connection on 465 port, please add this line
        oServer.port = 465;
        oServer.connectType = EASendMail.SmtpConnectType.connectSSLAuto;

        var oSmtp = new EASendMail.SmtpClient();

        var btn = document.getElementById("btnSend");
        btn.disabled = true;
        oSmtp.sendMailAsync(oServer, oMail).then(function (e) {
            result = "Email was sent successfully!";

            // Display Result by Diaglog box
            (new Windows.UI.Popups.MessageDialog(result, "Success")).showAsync();
            btn.disabled = false;
        },

        function (e) {
            // because javascript exception only gives the stack trace messages, but it is not
            // real description of exception, so we give a property lastErrorMessage for javascript.
            if (oSmtp.lastErrorMessage != "") {
                result = oSmtp.lastErrorMessage;
            }
            else {
                result = e.message;
            }
            oSmtp.close();

            // Display Result by Diaglog box
            (new Windows.UI.Popups.MessageDialog(result, "Error Information")).showAsync();
            btn.disabled = false;
        });
    }
})();

[JavaScript - Send email over TLS on 25 or 587 port]¶

The following example codes demonstrate how to use EASendMail SMTP component to send email with TLS (STARTTLS command) connection on 25 port. To get the full samples of EASendMail, please refer to Samples section.

(function () {
    "use strict";
    var appViewState = Windows.UI.ViewManagement.ApplicationViewState;
    var ui = WinJS.UI;
    var htmlinited = false;
    var editor;
    var asynCancel = null;
    var m_atts = new Array();
    ui.Pages.define("/default.html", {
        // This function is called whenever a user navigates to this page. It
        // populates the page elements with the app's data.
        ready: function (element, options) {
            init_gui();
        },

        unload: function () {

        }

    });

    function init_gui() {

        // add OnClick event handler
        var btn = document.getElementById("btnSend");
        btn.addEventListener("click", send_email, false);
    }

    function send_email() {
        var result = "";

        var oMail = new EASendMail.SmtpMail("TryIt");

        // Set sender email address, please change it to yours
        oMail.from = new EASendMail.MailAddress("test@emailarchitect.net");

        // Add recipient email address, please change it to yours
        oMail.to.add(new EASendMail.MailAddress("support@emailarchitect.net"));

        // Set email subject
        oMail.subject = "test email from JavaScript HTML5 project";

        // Set email body
        oMail.textBody = "this is a test email sent from Windows Store App using TLS";

        // Your SMTP server address
        var oServer = new EASendMail.SmtpServer("smtp.emailarchitect.net");

        // User and password for ESMTP authentication
        oServer.user = "test@emailarchitect.net";
        oServer.password = "testpassword";

        // Enable TLS connection on 25 port, please add this line
        oServer.connectType = EASendMail.SmtpConnectType.connectSSLAuto;

        var oSmtp = new EASendMail.SmtpClient();

        var btn = document.getElementById("btnSend");
        btn.disabled = true;
        oSmtp.sendMailAsync(oServer, oMail).then(function (e) {
            result = "Email was sent successfully!";

            // Display Result by Diaglog box
            (new Windows.UI.Popups.MessageDialog(result, "Success")).showAsync();
            btn.disabled = false;
        },

        function (e) {
            // because javascript exception only gives the stack trace messages, but it is not
            // real description of exception, so we give a property lastErrorMessage for javascript.
            if (oSmtp.lastErrorMessage != "") {
                result = oSmtp.lastErrorMessage;
            }
            else {
                result = e.message;
            }
            oSmtp.close();

            // Display Result by Diaglog box
            (new Windows.UI.Popups.MessageDialog(result, "Error Information")).showAsync();
            btn.disabled = false;
        });
    }
})();

Next Section

At next section I will introduce how to send email using Gmail account.

Tutorial Index

Send Email over SSL/TLS in JavaScript from Windows Store Apps - HTML5 - UWP¶

SSL and TLS Introduction¶

TLS 1.2¶

[JavaScript Exmaple - SSL/TLS Setting]¶

[JavaScript - Send email over direct SSL on 465 port]¶

[JavaScript - Send email over TLS on 25 or 587 port]¶

Share

See Also