Как отправить письмо из JavaScript

Я хочу, чтобы на моем сайте была возможность отправлять электронные письма без обновления страницы. Поэтому я хочу использовать Javascript.

<form action="javascript:sendMail();" name="pmForm" id="pmForm" method="post">
Enter Friend's Email:
<input name="pmSubject" id="pmSubject" type="text" maxlength="64" style="width:98%;" />
<input name="pmSubmit" type="submit" value="Invite" />

Вот как я хочу вызвать функцию, но я не уверен, что поместить в функцию javascript. Из проведенного мною исследования я нашел пример, в котором используется метод mailto, но, насколько я понимаю, на самом деле он не отправляется напрямую с сайта.

Поэтому мой вопрос: где я могу найти, что поместить в функцию JavaScript, чтобы отправить электронное письмо прямо с сайта?

function sendMail() {
    /* ...code here...    */
}

Вы не можете отправить электронное письмо напрямую с помощью JavaScript.

Однако вы можете открыть почтовый клиент пользователя:

window.open('mailto:test@example.com');

Есть также некоторые параметры для предварительного заполнения предмета и тела:

window.open('mailto:test@example.com?subject=subject&body=body');

Другим решением было бы сделать ajax-вызов на ваш сервер, чтобы сервер отправлял электронную почту. Будьте осторожны, чтобы никому не отправлять письма через ваш сервер.

Переадресация через ваш сервер - вызов стороннего API - безопасный и рекомендуемый

Ваш сервер может вызывать сторонний API после надлежащей аутентификации и авторизации. Ключи API не предоставляются клиенту.

node.js - https://www.npmjs.org/package/node-mandrill

var mandrill = require('node-mandrill')('<your API Key>'); 

function sendEmail ( _name, _email, _subject, _message) {
    mandrill('/messages/send', {
        message: {
            to: [{email: _email , name: _name}],
            from_email: 'noreply@yourdomain.com',
            subject: _subject,
            text: _message
        }
    }, function(error, response){
        if (error) console.log( error );
        else console.log(response);
    });
}

// define your own email api which points to your server.

app.post( '/api/sendemail/', function(req, res){

    var _name = req.body.name;
    var _email = req.body.email;
    var _subject = req.body.subject;
    var _messsage = req.body.message;

    //implement your spam protection or checks. 

    sendEmail ( _name, _email, _subject, _message );

});

а затем используйте $ .ajax на клиенте для вызова вашего почтового API.

Напрямую от клиента - вызов стороннего API - не рекомендуется

Отправить письмо, используя только JavaScript

in short: 
1. register for Mandrill to get an API key
2. load jQuery
3. use $.ajax to send an email

Как это -

function sendMail() {
    $.ajax({
      type: 'POST',
      url: 'https://mandrillapp.com/api/1.0/messages/send.json',
      data: {
        'key': 'YOUR API KEY HERE',
        'message': {
          'from_email': 'YOUR@EMAIL.HERE',
          'to': [
              {
                'email': 'RECIPIENT@EMAIL.HERE',
                'name': 'RECIPIENT NAME (OPTIONAL)',
                'type': 'to'
              }
            ],
          'autotext': 'true',
          'subject': 'YOUR SUBJECT HERE!',
          'html': 'YOUR EMAIL CONTENT HERE! YOU CAN USE HTML!'
        }
      }
     }).done(function(response) {
       console.log(response); // if you're into that sorta thing
     });
}

https://medium.com/design-startups/b53319616782

Примечание. Имейте в виду, что ваш ключ API виден любому пользователю, поэтому любой злоумышленник может использовать ваш ключ для отправки электронных писем, которые могут поглотить вашу квоту.

Я не мог найти ответ, который действительно удовлетворил первоначальный вопрос.

• Mandrill нежелателен в связи с новой ценовой политикой, плюс для этого требуется бэкэнд-сервис, если вы хотите сохранить свои учетные данные в безопасности.
• Часто предпочтительнее скрыть свою электронную почту, чтобы не попасть в списки (решение mailto выявляет эту проблему и неудобно для большинства пользователей).
• Это хлопотно, чтобы настроить sendMail или вообще требовать бэкэнда только для отправки электронного письма.

Я собрал простой бесплатный сервис, который позволяет вам сделать стандартный HTTP-запрос POST для отправки электронной почты. Он называется PostMail , и вы можете просто опубликовать форму, использовать Javascript или jQuery. Когда вы регистрируетесь, он предоставляет вам код, который вы можете скопировать и вставить на свой сайт. Вот некоторые примеры:

Javascript:

<form id="javascript_form">
    <input type="text" name="subject" placeholder="Subject" />
    <textarea name="text" placeholder="Message"></textarea>
    <input type="submit" id="js_send" value="Send" />
</form>

<script>

    //update this with your js_form selector
    var form_id_js = "javascript_form";

    var data_js = {
        "access_token": "{your access token}" // sent after you sign up
    };

    function js_onSuccess() {
        // remove this to avoid redirect
        window.location = window.location.pathname + "?message=Email+Successfully+Sent%21&isError=0";
    }

    function js_onError(error) {
        // remove this to avoid redirect
        window.location = window.location.pathname + "?message=Email+could+not+be+sent.&isError=1";
    }

    var sendButton = document.getElementById("js_send");

    function js_send() {
        sendButton.value='Sending…';
        sendButton.disabled=true;
        var request = new XMLHttpRequest();
        request.onreadystatechange = function() {
            if (request.readyState == 4 && request.status == 200) {
                js_onSuccess();
            } else
            if(request.readyState == 4) {
                js_onError(request.response);
            }
        };

        var subject = document.querySelector("#" + form_id_js + " [name='subject']").value;
        var message = document.querySelector("#" + form_id_js + " [name='text']").value;
        data_js['subject'] = subject;
        data_js['text'] = message;
        var params = toParams(data_js);

        request.open("POST", "https://postmail.invotes.com/send", true);
        request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

        request.send(params);

        return false;
    }

    sendButton.onclick = js_send;

    function toParams(data_js) {
        var form_data = [];
        for ( var key in data_js ) {
            form_data.push(encodeURIComponent(key) + "=" + encodeURIComponent(data_js[key]));
        }

        return form_data.join("&");
    }

    var js_form = document.getElementById(form_id_js);
    js_form.addEventListener("submit", function (e) {
        e.preventDefault();
    });
</script>

JQuery:

<form id="jquery_form">
    <input type="text" name="subject" placeholder="Subject" />
    <textarea name="text" placeholder="Message" ></textarea>
    <input type="submit" name="send" value="Send" />
</form>

<script>

    //update this with your $form selector
    var form_id = "jquery_form";

    var data = {
        "access_token": "{your access token}" // sent after you sign up
    };

    function onSuccess() {
        // remove this to avoid redirect
        window.location = window.location.pathname + "?message=Email+Successfully+Sent%21&isError=0";
    }

    function onError(error) {
        // remove this to avoid redirect
        window.location = window.location.pathname + "?message=Email+could+not+be+sent.&isError=1";
    }

    var sendButton = $("#" + form_id + " [name='send']");

    function send() {
        sendButton.val('Sending…');
        sendButton.prop('disabled',true);

        var subject = $("#" + form_id + " [name='subject']").val();
        var message = $("#" + form_id + " [name='text']").val();
        data['subject'] = subject;
        data['text'] = message;

        $.post('https://postmail.invotes.com/send',
            data,
            onSuccess
        ).fail(onError);

        return false;
    }

    sendButton.on('click', send);

    var $form = $("#" + form_id);
    $form.submit(function( event ) {
        event.preventDefault();
    });
</script>

Опять же, в полном раскрытии, я создал этот сервис, потому что я не мог найти подходящий ответ.

Вы можете найти, что поместить в функцию JavaScript в этом посте.

function getAjax() {
    try {
        if (window.XMLHttpRequest) {
            return new XMLHttpRequest();
        } else if (window.ActiveXObject) {
            try {
                return new ActiveXObject('Msxml2.XMLHTTP');
            } catch (try_again) {
                return new ActiveXObject('Microsoft.XMLHTTP');
            }
        }
    } catch (fail) {
        return null;
    }
}

function sendMail(to, subject) {
     var rq = getAjax();

     if (rq) {
         // Success; attempt to use an Ajax request to a PHP script to send the e-mail
         try {
             rq.open('GET', 'sendmail.php?to=' + encodeURIComponent(to) + '&subject=' + encodeURIComponent(subject) + '&d=' + new Date().getTime().toString(), true);

             rq.onreadystatechange = function () {
                 if (this.readyState === 4) {
                     if (this.status >= 400) {
                         // The request failed; fall back to e-mail client
                         window.open('mailto:' + to + '?subject=' + encodeURIComponent(subject));
                     }
                 }
             };

             rq.send(null);
         } catch (fail) {
             // Failed to open the request; fall back to e-mail client
             window.open('mailto:' + to + '?subject=' + encodeURIComponent(subject));
         }
     } else {
         // Failed to create the request; fall back to e-mail client
         window.open('mailto:' + to + '?subject=' + encodeURIComponent(subject));
     }
}

Предоставьте свой собственный скрипт PHP (или любой другой язык) для отправки электронной почты.

Я сообщаю вам новости. Вы НЕ МОЖЕТЕ отправить электронное письмо с JavaScript как таковым.

Исходя из контекста вопроса ОП, мой ответ выше не соответствует действительности, на что указал @KennyEvitt в комментариях. Похоже, вы можете использовать JavaScript в качестве SMTP-клиента .

Тем не менее , я не стал копаться глубже, чтобы выяснить, достаточно ли он безопасен и кроссбраузерен. Так что я не могу ни поощрять, ни отговаривать вас использовать его. Используйте на свой риск.

Я знаю, что слишком поздно, чтобы написать ответ на этот вопрос, но, тем не менее, я думаю, что он будет полезен всем, кто думает об отправке писем через javascript.

Первый способ, который я бы предложил, - это использовать обратный вызов для этого на сервере. Если вы действительно хотите, чтобы он обрабатывался с использованием javascript, я рекомендую следующее.

Самым простым способом, который я нашел, было использование smtpJs. Бесплатная библиотека, которую можно использовать для отправки писем.

1. Включите скрипт, как показано ниже

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

2. Вы можете отправить электронное письмо, как это

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)
    );

Что нежелательно, так как он будет отображать ваш пароль на стороне клиента. Таким образом, вы можете сделать следующее, зашифровав свои учетные данные SMTP и заблокировав их в одном домене, и вместо этого передайте безопасный токен вместо учетных данных.

Email.send({
    SecureToken : "C973D7AD-F097-4B95-91F4-40ABC5567812",
    To : 'them@website.com',
    From : "you@isp.com",
    Subject : "This is the subject",
    Body : "And this is the body"
}).then(
  message => alert(message)
);

Наконец, если у вас нет SMTP-сервера, вы используете службу SMTP-ретрансляции, такую ​​как Elastic Email

Также здесь есть ссылка на официальный сайт SmtpJS.com, где вы можете найти все примеры, которые вам нужны, и место, где вы можете создать свой безопасный токен.

Я надеюсь, что кто-то найдет эти детали полезными. Удачного кодирования.

Кажется, на горизонте новое решение. Это называется EmailJS . Они утверждают, что код сервера не требуется. Вы можете запросить приглашение.

Обновление август 2016: EmailJS, кажется, уже в живых. Вы можете отправлять до 200 электронных писем в месяц бесплатно, и он предлагает подписку на большие объемы.

window.open ( 'электронной почты: test@example.com'); как указано выше, ничего не скрывает спам-боты от адреса электронной почты «test@example.com». Я привык постоянно сталкиваться с этой проблемой.

var recipient="test";
var at = String.fromCharCode(64);
var dotcom="example.com";
var mail="mailto:";
window.open(mail+recipient+at+dotcom);

Javascript на стороне клиента, вы не можете по электронной почте с Javascript. Браузер распознает, может быть, только mailto:и запускает почтовый клиент по умолчанию.

В вашей sendMail()функции добавьте ajax-вызов в ваш бэкэнд, где вы можете реализовать это на стороне сервера.

JavaScript не может отправлять электронную почту из веб-браузера. Однако, отступая от решения, которое вы уже пытались внедрить, вы можете сделать что-то, что соответствует первоначальному требованию:

отправить электронное письмо без обновления страницы

Вы можете использовать JavaScript для создания значений, которые понадобятся электронной почте, а затем сделать AJAX-запрос к ресурсу сервера, который фактически отправляет электронную почту. (Я не знаю, какие серверные языки / технологии вы используете, так что эта часть зависит от вас.)

Если вы не знакомы с AJAX, быстрый поиск в Google даст вам много информации. Как правило, вы можете быстро его запустить и запустить с помощью функции jQuery $ .ajax (). Вам просто нужно иметь страницу на сервере, которую можно вызвать в запросе.

Кажется, что один «ответ» на это заключается в реализации SMPT-клиента. Смотрите email.js для библиотеки JavaScript с SMTP-клиентом.

Вот репозиторий GitHub для SMTP-клиента. Основываясь на README репо, кажется, что в зависимости от браузера клиента могут потребоваться различные прокладки или полифилы, но в целом это, безусловно, представляется возможным (если на самом деле значительно не выполнено), хотя это не так легко описать даже разумно длинный ответ здесь.

Есть комбинированный сервис. Вы можете объединить перечисленные выше решения, такие как mandrill, с сервисом EmailJS, который может сделать систему более безопасной. Они еще не начали службу, хотя.

Еще один способ отправки электронной почты из JavaScript, это использовать directtomx.com следующим образом;

 Email = {
 Send : function (to,from,subject,body,apikey)
    {
        if (apikey == undefined)
        {
            apikey = Email.apikey;
        }
        var nocache= Math.floor((Math.random() * 1000000) + 1);
        var strUrl = "http://directtomx.azurewebsites.net/mx.asmx/Send?";
        strUrl += "apikey=" + apikey;
        strUrl += "&from=" + from;
        strUrl += "&to=" + to;
        strUrl += "&subject=" + encodeURIComponent(subject);
        strUrl += "&body=" + encodeURIComponent(body);
        strUrl += "&cachebuster=" + nocache;
        Email.addScript(strUrl);
    },
    apikey : "",
    addScript : function(src){
            var s = document.createElement( 'link' );
            s.setAttribute( 'rel', 'stylesheet' );
            s.setAttribute( 'type', 'text/xml' );
            s.setAttribute( 'href', src);
            document.body.appendChild( s );
    }
};

Затем позвоните со своей страницы следующим образом;

 window.onload = function(){
    Email.apikey = "-- Your api key ---";
    Email.Send("to@domain.com","from@domain.com","Sent","Worked!");
 }

Я бы сделал это с библиотекой SMTPJ . Он предлагает шифрование ваших учетных данных, таких как имя пользователя, пароль и т. Д.

На ваш вопрос нет однозначного ответа, так как мы не можем отправлять электронную почту только с использованием javascript, но есть способы использовать javascript для отправки нам электронных писем:

1) используя api для вызова API через javascript, чтобы отправить нам электронное письмо, например, https://www.emailjs.com говорит, что вы можете использовать такой код ниже для вызова их api после некоторой настройки:

var service_id = 'my_mandrill';
var template_id = 'feedback';
var template_params = {
name: 'John',
reply_email: 'john@doe.com',
message: 'This is awesome!'
};

emailjs.send(service_id,template_id,template_params);

2) создать бэкэнд-код для отправки вам электронного письма, вы можете использовать любой бэкэнд-фреймворк для вас.

3) используя что-то вроде:

window.open('mailto:me@http://stackoverflow.com/');

который откроет ваше почтовое приложение, это может попасть в заблокированное всплывающее окно в вашем браузере.

В общем, отправка электронной почты - это задача сервера, поэтому ее следует выполнять на языках бэкэнда, но мы можем использовать javascript для сбора необходимых данных и отправки их на сервер или в API, также мы можем использовать приложение третьей четности и открывать их. через браузер, используя JavaScript, как указано выше.

Короткий ответ: вы не можете сделать это, используя только JavaScript. Вам понадобится серверный обработчик для соединения с SMTP-сервером для фактической отправки почты. В Интернете есть много простых почтовых сценариев, таких как этот для PHP:

Используйте Ajax для отправки запроса в PHP-скрипт, убедитесь, что обязательные поля не пустые или неправильные, с помощью js также ведите учет почты, отправленной кем-либо с вашего сервера.

function sendMail() is good for doing that.

Проверьте наличие ошибок в письме из вашего скрипта и примите соответствующие меры.
Например, для его устранения, если почтовый адрес неверный или письмо не отправлено из-за проблем с сервером, или оно находится в очереди в таком состоянии, немедленно сообщите об этом пользователю и предотвратите многократную отправку одного и того же электронного письма снова и снова. Получите ответ от вашего скрипта, используя jQuery GET и POST

$ .Get (URL, вызов); $ .Post (URL, вызов);

Поскольку все это замечательная информация, есть небольшой API под названием Mandrill для отправки писем из javascript, и он работает отлично. Вы можете дать ему шанс. Вот небольшой учебник для начала.

Отправьте электронное письмо, используя JavaScript или jQuery

var ConvertedFileStream;
var g_recipient;
var g_subject;
var g_body;
var g_attachmentname;


function SendMailItem(p_recipient, p_subject, p_body, p_file, p_attachmentname, progressSymbol) {

    // Email address of the recipient 
    g_recipient = p_recipient;

   // Subject line of an email
    g_subject = p_subject;

   // Body description of an email
    g_body = p_body;

    // attachments of an email
    g_attachmentname = p_attachmentname;

    SendC360Email(g_recipient, g_subject, g_body, g_attachmentname);

}

function SendC360Email(g_recipient, g_subject, g_body, g_attachmentname) {
    var flag = confirm('Would you like continue with email');
    if (flag == true) {

        try {
            //p_file = g_attachmentname;
            //var FileExtension = p_file.substring(p_file.lastIndexOf(".") + 1);
           // FileExtension = FileExtension.toUpperCase();
            //alert(FileExtension);
            SendMailHere = true;

            //if (FileExtension != "PDF") {

            //    if (confirm('Convert to PDF?')) {
            //        SendMailHere = false;                    
            //    }

            //}
            if (SendMailHere) {
                var objO = new ActiveXObject('Outlook.Application');

                var objNS = objO.GetNameSpace('MAPI');

                var mItm = objO.CreateItem(0);

                if (g_recipient.length > 0) {
                    mItm.To = g_recipient;
                }

                mItm.Subject = g_subject;

                // if there is only one attachment                 
                // p_file = g_attachmentname;
                // mAts.add(p_file, 1, g_body.length + 1, g_attachmentname);

                // If there are multiple attachment files
                //Split the  files names
                var arrFileName = g_attachmentname.split(";");
                 // alert(g_attachmentname);
                //alert(arrFileName.length);
                var mAts = mItm.Attachments;

                for (var i = 0; i < arrFileName.length; i++)
                {
                    //alert(arrFileName[i]);
                    p_file = arrFileName[i];
                    if (p_file.length > 0)
                    {                     
                        //mAts.add(p_file, 1, g_body.length + 1, g_attachmentname);
                        mAts.add(p_file, i, g_body.length + 1, p_file);

                    }
                }

                mItm.Display();

                mItm.Body = g_body;

                mItm.GetInspector.WindowState = 2;

            }
            //hideProgressDiv();

        } catch (e) {
            //debugger;
            //hideProgressDiv();
            alert('Unable to send email.  Please check the following: \n' +
                    '1. Microsoft Outlook is installed.\n' +
                    '2. In IE the SharePoint Site is trusted.\n' +
                    '3. In IE the setting for Initialize and Script ActiveX controls not marked as safe is Enabled in the Trusted zone.');
        }
    }
  }