Como enviar um email de JavaScript

Quero que meu site tenha a capacidade de enviar um email sem atualizar a página. Então, eu quero usar 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" />

Aqui está como eu quero chamar a função, mas não sei o que colocar na função javascript. A partir da pesquisa que fiz, encontrei um exemplo que usa o método mailto, mas meu entendimento é que, na verdade, ele não é enviado diretamente do site.

Portanto, minha pergunta é onde posso encontrar o que colocar na função JavaScript para enviar um email diretamente do site.

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

Você não pode enviar um email diretamente com javascript.

No entanto, você pode abrir o cliente de email do usuário:

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

Existem também alguns parâmetros para preencher previamente o assunto e o corpo:

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

Outra solução seria fazer uma chamada ajax para o servidor, para que o servidor envie o email. Tenha cuidado para não permitir que ninguém envie nenhum email através do seu servidor.

Indireto via servidor - chamando a API de terceiros - seguro e recomendado

Seu servidor pode chamar a API de terceiros após autenticação e autorização adequadas. As chaves da API não são expostas ao cliente.

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

});

e use use $ .ajax no cliente para chamar sua API de email.

Diretamente do cliente - Chamando API de terceiros - não recomendado

Envie um email usando apenas JavaScript

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

Como isso -

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

Nota: lembre-se de que sua chave de API é visível para qualquer pessoa, portanto, qualquer usuário mal-intencionado pode usá-la para enviar e-mails que podem consumir sua cota.

Não consegui encontrar uma resposta que realmente satisfizesse a pergunta original.

• O Mandrill não é desejável devido à sua nova política de preços, além de exigir um serviço de back-end se você quiser manter suas credenciais seguras.
• Geralmente, é preferível ocultar seu e-mail para não aparecer em nenhuma lista (a solução mailto expõe esse problema e não é conveniente para a maioria dos usuários).
• É um aborrecimento configurar o sendMail ou exigir um back-end apenas para enviar um email.

Eu montei um serviço gratuito simples que permite que você faça uma solicitação HTTP POST padrão para enviar um email. Chama-se PostMail , e você pode simplesmente postar um formulário, usar Javascript ou jQuery. Quando você se inscreve, ele fornece um código que você pode copiar e colar em seu site. aqui estão alguns exemplos:

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>

Novamente, na divulgação completa, criei este serviço porque não consegui encontrar uma resposta adequada.

Você pode encontrar o que colocar dentro da função JavaScript nesta postagem.

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

Forneça seu próprio script PHP (ou qualquer outro idioma) para enviar o email.

Estou lhe dando a notícia. Você NÃO PODE enviar um email com JavaScript propriamente dito.

Com base no contexto da pergunta do OP, minha resposta acima não é mais verdadeira, como apontado por @KennyEvitt nos comentários. Parece que você pode usar o JavaScript como um cliente SMTP .

No entanto , não me aprofundou mais para descobrir se é seguro e compatível com vários navegadores. Portanto, não posso encorajar nem desencorajar você a usá-lo. Use por sua conta e risco.

Sei que estou muito atrasado para escrever uma resposta para esta pergunta, mas, no entanto, acho que isso será útil para qualquer pessoa que esteja pensando em enviar e-mails via javascript.

A primeira maneira que eu sugeriria é usar um retorno de chamada para fazer isso no servidor. Se você realmente deseja que ele seja manipulado usando o seguinte javascript, é o que eu recomendo.

A maneira mais fácil que encontrei foi usar smtpJs. Uma biblioteca gratuita que pode ser usada para enviar emails.

1.Include o script como abaixo

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

2. Você pode enviar um email como este

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

Isso não é aconselhável, pois ele exibirá sua senha no lado do cliente. Assim, você pode criptografar suas credenciais SMTP, bloqueá-las em um único domínio e passar um token seguro em vez das credenciais.

Email.send({
    SecureToken : "C973D7AD-F097-4B95-91F4-40ABC5567812",
    To : '[email protected]',
    From : "[email protected]",
    Subject : "This is the subject",
    Body : "And this is the body"
}).then(
  message => alert(message)
);

Finalmente, se você não tiver um servidor SMTP, use um serviço de retransmissão smtp, como Elastic Email

Também aqui está o link para o site oficial do SmtpJS.com, onde você pode encontrar todo o exemplo necessário e o local onde pode criar seu token seguro.

Espero que alguém ache esses detalhes úteis. Feliz codificação.

Parece haver uma nova solução no horizonte. Chama-se EmailJS . Eles afirmam que nenhum código de servidor é necessário. Você pode solicitar um convite.

Atualização em agosto de 2016: o EmailJS parece já estar ativo. Você pode enviar até 200 e-mails por mês gratuitamente e oferece assinaturas para volumes maiores.

window.open ('mailto: [email protected]'); como acima, nada impede que o endereço de email "[email protected]" seja coletado por spambots. Eu costumava me deparar com esse problema constantemente.

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

Javascript é do lado do cliente, você não pode enviar e-mail com Javascript. O navegador reconhece apenas talvez mailto:e inicia o seu cliente de email padrão.

Em sua sendMail()função, adicione uma chamada ajax ao seu back-end, onde você pode implementar isso no lado do servidor.

JavaScript não pode enviar email de um navegador da web. No entanto, afastando-se da solução que você já tentou implementar, você pode fazer algo que atenda ao requisito original:

envie um email sem atualizar a página

Você pode usar o JavaScript para construir os valores que o email precisará e, em seguida, fazer uma solicitação AJAX para um recurso do servidor que realmente envia o email. (Não sei quais idiomas / tecnologias do servidor você está usando, portanto essa parte depende de você.)

Se você não conhece o AJAX, uma rápida pesquisa no Google fornece muitas informações. Geralmente você pode colocá-lo em funcionamento rapidamente com a função $ .ajax () do jQuery. Você só precisa ter uma página no servidor que possa ser chamada na solicitação.

Parece que uma 'resposta' para isso é implementar um cliente SMPT. Consulte email.js para obter uma biblioteca JavaScript com um cliente SMTP.

Aqui está o repositório GitHub para o cliente SMTP. Com base no README do repo, parece que vários shims ou polyfills podem ser necessários, dependendo do navegador do cliente, mas no geral isso parece viável (se não realmente realizado de maneira significativa), mas não de uma maneira que possa ser facilmente descrita, mesmo que razoavelmente- resposta longa aqui.

Existe um serviço combinado. Você pode combinar as soluções listadas acima, como mandrill, com um serviço EmailJS, que pode tornar o sistema mais seguro. Eles ainda não começaram o serviço.

Outra maneira de enviar email do JavaScript é usar o directtomx.com da seguinte maneira;

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

Em seguida, chame-o da sua página da seguinte maneira;

 window.onload = function(){
    Email.apikey = "-- Your api key ---";
    Email.Send("[email protected]","[email protected]","Sent","Worked!");
 }

Eu faria isso com a biblioteca SMTPJs . Ele oferece criptografia para suas credenciais, como nome de usuário, senha etc.

Não há uma resposta direta à sua pergunta, pois não podemos enviar e-mail apenas usando javascript, mas existem maneiras de usar o javascript para enviar e-mails para nós:

1) usar uma API para e chamar a API via javascript para enviar o e-mail para nós, por exemplo, https://www.emailjs.com diz que você pode usar esse código abaixo para chamar a API após alguma configuração:

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) crie um código de back-end para enviar um email para você; você pode usar qualquer estrutura de back-end para fazer isso por você.

3) usando algo como:

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

que abrirá seu aplicativo de e-mail, isso poderá entrar no pop-up bloqueado no seu navegador.

Em geral, enviar um email é uma tarefa do servidor, portanto, isso deve ser feito em idiomas de back-end, mas podemos usar o javascript para coletar os dados necessários e enviá-los ao servidor ou API, também podemos usar o aplicativo de terceiros e abri-los através do navegador usando javascript, como mencionado acima.

A resposta curta é que você não pode fazê-lo usando JavaScript sozinho. Você precisaria de um manipulador do lado do servidor para se conectar ao servidor SMTP para realmente enviar o email. Existem muitos scripts de correio simples online, como este para PHP:

Use o Ajax para enviar solicitação para o script PHP, verifique se o campo obrigatório não está vazio ou incorreto usando js também mantenha um registro do envio de mensagens por quem do seu servidor.

function sendMail() is good for doing that.

Verifique se há algum erro detectado ao enviar a partir do seu script e tome as medidas apropriadas.
Para resolvê-lo, por exemplo, se o endereço de email estiver incorreto ou o email não for enviado devido a um problema no servidor ou estiver na fila, em tal condição, informe-o imediatamente ao usuário e evite o envio múltiplo do mesmo email repetidamente. Obtenha resposta do seu script usando jQuery GET e POST

$ .get (URL, retorno de chamada); $ .post (URL, retorno de chamada);

Como essas informações são maravilhosas, existe uma pequena API chamada Mandrill para enviar e-mails a partir de javascript e funciona perfeitamente. Você pode tentar. Aqui está um pequeno tutorial para o começo.

Envie um email usando o JavaScript ou 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.');
        }
    }
  }