如何从 JavaScript 发送电子邮件

2022-08-30 00:00:06

我希望我的网站能够在不刷新页面的情况下发送电子邮件。所以我想使用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...    */
}

答案 1

您不能使用 javascript 直接发送电子邮件。

但是,您可以打开用户的邮件客户端:

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

还有一些参数可以预先填充主体和正文:

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

另一种解决方案是对服务器执行ajax调用,以便服务器发送电子邮件。请注意,不要让任何人通过您的服务器发送任何电子邮件。


答案 2

间接通过您的服务器 - 调用第三方API - 安全且推荐


您的服务器可以在经过适当的身份验证和授权后调用第三方 API。API 密钥不会向客户端公开。

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

const 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){
            
    let _name = req.body.name;
    let _email = req.body.email;
    let _subject = req.body.subject;
    let _messsage = req.body.message;

    //implement your spam protection or checks. 

    sendEmail ( _name, _email, _subject, _message );

});

然后在客户端上使用 $.ajax 调用您的电子邮件 API。


直接从客户端 - 调用第三方 API - 不推荐


仅使用 JavaScript 发送电子邮件

总之:

  1. 注册 Mandrill 以获取 API 密钥
  2. 加载 jQuery
  3. 使用 $.ajax 发送电子邮件

像这样——

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 密钥对任何人都是可见的,因此任何恶意用户都可能使用您的密钥发送可能超出配额的电子邮件。