Send Email using Hotmail/MSN Live/Outlook/Office365 in Javascript from Windows Store Apps - HTML5 - UWP

In previous section, I introduced how to send email using Yahoo account. In this section, I will introduce how to use your Hotmail/MSN Live/Outlook.com/Office365 account to send email in JavaScript.

Introduction

Hotmail/MSN Live/Outlook.com SMTP server address is smtp.office365.com. It requires TLS connection to do user authentication, and you should use your Hotmail/MSN Live/Outlook.com email address as the user name for ESMTP authentication. For example: your email is liveid@hotmail.com, and then the user name should be liveid@hotmail.com.

Server Port SSL/TLS
smtp.office365.com 25, 587 TLS

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 using Hotmail/MSN Live/Outlook.com account over TLS connection]

The following example codes demonstrate how to use EASendMail SMTP component to send email using Hotmail/MSN Live/Outlook.com account.

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 Hotmail/Live/Outlook.com sender email address, please change it to yours
        oMail.from = new EASendMail.MailAddress("liveid@hotmail.com");

        // 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 Hotmail.";

        // Hotmail SMTP server address
        var oServer = new EASendMail.SmtpServer("smtp.office365.com");

        // User and password for Hotmail authentication
        oServer.user = "livid@hotmail.com";

        // If you got authentication error, try to create an app password instead of your user password.
        // https://support.microsoft.com/en-us/account-billing/using-app-passwords-with-apps-that-don-t-support-two-step-verification-5896ed9b-4263-e681-128a-a6f2979a7944
        oServer.password = "your password or app password";

        // Enable TLS connection on 25 port
        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;
        });
    }
})();

Hotmail SMTP OAUTH

If your account enabled two-factor authentication, you cannot login your account by normal user authentication, you should use SMTP OAUTH or App Password.

Microsoft Live SMTP servers (Hotmail, Oultook personal account) have been extended to support authorization via the industry-standard OAuth 2.0 protocol. Using OAUTH protocol, user can do authentication by Microsoft Web OAuth instead of inputting user and password directly in application. This way is more secure, but a little bit complex.

Using Microsoft Hotmail SMTP OAUTH

Or you can generate App Passwords and use this app password instead of your user password.

Send Email using Office 365

Office 365 SMTP server uses 587 port and explicit SSL (TLS) connection.

Server Port SSL/TLS
smtp.office365.com 25, 587 (recommended) TLS

App Password and SmtpClientAuthenticationDisabled

If your account enabled two-factor authentication, you cannot login your account by normal user authentication, you should create an App Passwords and use this App Password instead of the user password.

You should also check if authenticated client SMTP submission (SMTP AUTH) is enabled:

Enable or disable authenticated client SMTP submission (SMTP AUTH) in Exchange Online.

[JavaScript - Send email using Office365 account over TLS connection]

The following example codes demonstrate how to use EASendMail SMTP component to send email using Office365 account. 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 office365 sender email address, please change it to yours
        oMail.from = new EASendMail.MailAddress("myid@mydomain");

        // 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 office365.";

        // Office365 SMTP server address
        var oServer = new EASendMail.SmtpServer("smtp.office365.com");

        // User and password for office365 authentication
        oServer.user = "myid@mydomain";

        // If you got authentication error, try to create an app password instead of your user password.
        // https://support.microsoft.com/en-us/account-billing/using-app-passwords-with-apps-that-don-t-support-two-step-verification-5896ed9b-4263-e681-128a-a6f2979a7944
        oServer.password = "your password or app password";

        // Enable TLS connection on 587 port
        oServer.port = 587;
        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;
        });
    }
})();

Office365 EWS OAUTH

If your account enabled two-factor authentication, you cannot login your account by normal user authentication, you should use SMTP/EWS OAUTH or App Password.

Microsoft Office365 EWS servers have been extended to support authorization via the industry-standard OAuth 2.0 protocol. Using OAUTH protocol, user can do authentication by Microsoft Web OAuth instead of inputting user and password directly in application. This way is more secure, but a little bit complex.

Using Microsoft Office365 EWS OAUTH

Or you can generate App Passwords and use this app password instead of your user password.

Next Section

At next section I will introduce how to send email with HTML format in JavaScript.

Appendix

Comments

If you have any comments or questions about above example codes, please click here to add your comments.