Как отправить электронное письмо с JavaScript

Ответ 1

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

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

window.open('mailto:[email protected]');

Есть также некоторые параметры, чтобы предварительно заполнить объект и тело:

window.open('mailto:[email protected]?subject=subject&body=body');

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

Ответ 2

Непрямой через ваш сервер - вызов стороннего 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: '[email protected]',
            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': '[email protected]',
          'to': [
              {
                'email': '[email protected]',
                '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 отображается всем, поэтому любой злоумышленник может использовать ваш ключ для отправки сообщений электронной почты, которые могут съесть вашу квоту.

Ответ 3

Вы можете найти, что добавить в функцию 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 скрипт 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 (или любой другой язык) script, чтобы отправить электронное письмо.

Ответ 4

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

• 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>

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

Ответ 5

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

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

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

Ответ 6

window.open( 'электронной почты: [email protected]'); как указано выше не скрывает адрес электронной почты "[email protected]" от сбора спам-ботов. Я постоянно сталкивался с этой проблемой.

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

Ответ 7

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

Ответ 8

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

Ответ 9

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

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

Ответ 10

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

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

Ответ 11

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

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

var service_id = 'my_mandrill';
var template_id = 'feedback';
var template_params = {
name: 'John',
reply_email: '[email protected]',
message: 'This is awesome!'
};

emailjs.send(service_id,template_id,template_params);

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

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

window.open('mailto:[email protected]://stackoverflow.com/');

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

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

Ответ 12

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

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

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

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

Ответ 13

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

Ответ 14

Другим способом отправки электронной почты из 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("[email protected]","[email protected]","Sent","Worked!");
 }

Ответ 15

Я бы сделал это с помощью SMTPJs library.It предлагает шифрование для ваших учетных данных, таких как имя пользователя, пароль и т.д.

Ответ 16

function send() {
  setTimeout(function() {
    window.open("mailto:" + document.getElementById('email').value + "?subject=" + document.getElementById('subject').value + "&body=" + document.getElementById('message').value);
  }, 320);
}

input {
  text-align: center;
  border-top: none;
  border-right: none;
  border-left: none;
  height: 10vw;
  font-size: 2vw;
  width: 100vw;
}

textarea {
  text-align: center;
  border-top: none;
  border-right: none;
  border-left: none;
  border-radius: 5px;
  width: 100vw;
  height: 50vh;
  font-size: 2vw;
}

button {
  border: none;
  background-color: white;
  position: fixed;
  right: 5px;
  top: 5px;
  transition: transform .5s;
}

input:focus {
  outline: none;
  color: orange;
  border-radius: 3px;
}

textarea:focus {
  outline: none;
  color: orange;
  border-radius: 7px;
}

button:focus {
  outline: none;
  transform: scale(0);
  transform: rotate(360deg);
}

<!DOCTYPE html>
<html>

<head>
  <title>Send Email</title>
</head>

<body align=center>
  <input id="email" type="email" placeholder="[email protected]"></input><br><br>
  <input id="subject" placeholder="Subject"></input><br>
  <textarea id="message" placeholder="Message"></textarea><br>
  <button id="send" onclick="send()"><img src=https://www.dropbox.com/s/chxcszvnrdjh1zm/send.png?dl=1 width=50px height=50px></img></button>
</body>

</html>

Ответ 17

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

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

function sendMail() is good for doing that.

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

.

$получить (URL, обратного вызова); $.post(URL-адрес, обратный вызов);

Ответ 18

Я знаю, что слишком поздно, чтобы написать ответ на этот вопрос, но, тем не менее, я думаю, что он будет полезен всем, кто думает об отправке писем через 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 : '[email protected]',
    From : "[email protected]",
    Subject : "This is the subject",
    Body : "And this is the body"
    }).then(
      message => alert(message)
    );

Ответ 19

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

Ответ 20

Отправьте электронное письмо с помощью 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.');
        }
    }
  }