我希望我的网站有能力发送电子邮件而不刷新页面。我想用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无法做到这一点。您需要一个服务器端处理程序来连接SMTP服务器以实际发送邮件。网上有很多简单的邮件脚本,比如下面这个PHP脚本:

使用Ajax向PHP脚本发送请求,检查所需字段是否为空或使用js不正确,还保留从您的服务器发送的邮件的记录。

function sendMail() is good for doing that.

检查从脚本发送邮件时捕捉到的任何错误,并采取适当的操作。 为了解决它,例如,如果邮件地址不正确或邮件没有发送由于服务器问题或它在队列中,在这种情况下报告给用户立即和防止多人发送相同的电子邮件一次又一次。 使用jQuery Get和POST从你的脚本得到响应

.get元(URL, callback); .post元(URL, callback);

其他回答

简单的回答是,仅使用JavaScript无法做到这一点。您需要一个服务器端处理程序来连接SMTP服务器以实际发送邮件。网上有很多简单的邮件脚本,比如下面这个PHP脚本:

使用Ajax向PHP脚本发送请求,检查所需字段是否为空或使用js不正确,还保留从您的服务器发送的邮件的记录。

function sendMail() is good for doing that.

检查从脚本发送邮件时捕捉到的任何错误,并采取适当的操作。 为了解决它,例如,如果邮件地址不正确或邮件没有发送由于服务器问题或它在队列中,在这种情况下报告给用户立即和防止多人发送相同的电子邮件一次又一次。 使用jQuery Get和POST从你的脚本得到响应

.get元(URL, callback); .post元(URL, callback);

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


你的服务器可以调用第三方API。API密钥不会公开给客户端。

node . js

const axios = require('axios');

async function sendEmail(name, email, subject, message) {
  const data = JSON.stringify({
    "Messages": [{
      "From": {"Email": "<YOUR EMAIL>", "Name": "<YOUR NAME>"},
      "To": [{"Email": email, "Name": name}],
      "Subject": subject,
      "TextPart": message
    }]
  });

  const config = {
    method: 'post',
    url: 'https://api.mailjet.com/v3.1/send',
    data: data,
    headers: {'Content-Type': 'application/json'},
    auth: {username: '<API Key>', password: '<Secret Key>'},
  };

  return axios(config)
    .then(function (response) {
      console.log(JSON.stringify(response.data));
    })
    .catch(function (error) {
      console.log(error);
    });

}

// define your own email api which points to your server.
app.post('/api/sendemail/', function (req, res) {
  const {name, email, subject, message} = req.body;
  //implement your spam protection or checks.
  sendEmail(name, email, subject, message);
});

然后在客户端使用use fetch调用你的电子邮件API。 使用您在Mailjet上注册时使用的电子邮件。您还可以验证更多的地址。Mailjet提供了一个慷慨的免费等级。


2023年更新:正如评论中指出的那样,由于CORS,下面的方法不再有效

只有当您想测试发送电子邮件并执行此操作时,这才有用

访问https://api.mailjet.com/stats(是的,404页面) 并在浏览器控制台中运行这段代码(填充秘密)

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


简而言之:

注册Mailjet以获得API密钥和Secret 使用fetch调用API发送电子邮件

像这样——

function sendMail(name, email, subject, message) {
  const myHeaders = new Headers();
  myHeaders.append("Content-Type", "application/json");
  myHeaders.set('Authorization', 'Basic ' + btoa('<API Key>'+":" +'<Secret Key>'));

  const data = JSON.stringify({
    "Messages": [{
      "From": {"Email": "<YOUR EMAIL>", "Name": "<YOUR NAME>"},
      "To": [{"Email": email, "Name": name}],
      "Subject": subject,
      "TextPart": message
    }]
  });

  const requestOptions = {
    method: 'POST',
    headers: myHeaders,
    body: data,
  };

  fetch("https://api.mailjet.com/v3.1/send", requestOptions)
    .then(response => response.text())
    .then(result => console.log(result))
    .catch(error => console.log('error', error));
}

sendMail('Test Name',"<YOUR EMAIL>",'Test Subject','Test Message')

注意:请记住,您的API密钥对任何人都是可见的,因此任何恶意用户都可能使用您的密钥发送电子邮件,从而耗尽您的配额。

似乎有一个新的解决办法即将出现。它叫EmailJS。他们声称不需要服务器代码。你可以申请邀请。

2016年8月更新:EmailJS似乎已经上线了。你每月可以免费发送200封电子邮件,如果数量更多,还可以订阅。

我要把这个消息告诉你。JavaScript本身不能发送电子邮件。


根据OP问题的上下文,我上面的答案已经不成立了,正如@KennyEvitt在评论中指出的那样。看起来您可以使用JavaScript作为SMTP客户端。

但是,我还没有深入研究它是否足够安全和跨浏览器兼容。所以,我既不鼓励也不劝阻你使用它。使用风险自负。

解决这个问题的一个“答案”似乎是实现一个SMPT客户机。关于带有SMTP客户端的JavaScript库,请参阅email.js。

这是SMTP客户端的GitHub回购。根据repo的README,根据客户端浏览器的不同,似乎需要各种shims或polyfill,但总的来说,这似乎是可行的(如果实际上没有显著完成),尽管不是以一种简单的方式来描述,甚至在这里也没有一个合理的长答案。