如何从JavaScript发送电子邮件

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

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

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

还有一些参数可以预填充主题和主体:

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

另一种解决方案是对服务器进行ajax调用，以便服务器发送电子邮件。注意不要允许任何人通过你的服务器发送任何电子邮件。

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

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

然而，我还没有深入挖掘，看看它是否安全&足够的跨浏览器兼容性。所以，我既不鼓励也不劝阻你使用它。使用风险自负。

Javascript是客户端，你不能用Javascript发邮件。浏览器可能只能识别mailto:并启动默认的邮件客户端。

在你的sendMail()函数中，在后端添加一个ajax调用，你可以在服务器端实现它。

你可以在这篇文章中找到在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不能从web浏览器发送电子邮件。然而，从你已经尝试实现的解决方案中退一步，你可以做一些满足最初需求的事情:

发送邮件时不刷新页面

您可以使用JavaScript构造电子邮件所需的值，然后向实际发送电子邮件的服务器资源发出AJAX请求。(我不知道你在使用什么服务器端语言/技术，所以这部分取决于你。)

如果您不熟悉AJAX，快速搜索谷歌将为您提供大量信息。通常，你可以使用jQuery的$.ajax()函数快速启动并运行它。您只需要在服务器上有一个可以在请求中调用的页面。

间接通过您的服务器-调用第三方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);
});

，然后在客户端使用获取调用您的电子邮件API。 使用你用来在Mailjet上注册的from email。您还可以验证更多的地址。Mailjet 提供一个慷慨的免费层 . < / p >

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

只使用JavaScript发送电子邮件

简而言之:

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

像这样——

function sendMail(name, email, subject, message) {
const myHeaders = new Headers();
myHeaders.append("Content-Type", "application/json");
myHeaders.set('Authorization', 'Basic ' + base64.encode('<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));
}

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

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

使用Ajax将请求发送到PHP脚本，使用js检查必填字段是否为空或不正确，并保存服务器发送邮件的记录。

function sendMail() is good for doing that.

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

< p > $ . get (URL,回调); $ . post (URL,回调);< / p >

因为这些都是很棒的信息，所以有一个叫做山魈的小api可以从javascript发送邮件，它工作得很完美。你可以试试。这里有一个小教程作为开始。

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

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

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

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

存在组合业务。您可以将上面列出的解决方案(如mandrill)与EmailJS服务结合使用，这可以使系统更加安全。 不过他们还没有开始服务。< / p >

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

另一种从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!");
}

使用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.');
}
}
}

我找不到一个能真正满足最初问题的答案。

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

再次坦白地说，我创建这个服务是因为我找不到合适的答案。

当且仅当我必须使用some js库时，我将使用SMTPJs库。它提供加密您的凭证，如用户名，密码等。

你的问题没有一个直接的答案，因为我们不能只使用javascript发送电子邮件，但有一些方法可以使用javascript为我们发送电子邮件:

1)使用api并通过javascript调用api来为我们发送电子邮件，例如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发送电子邮件的人。

我建议的第一种方法是在服务器上使用回调来完成此操作。如果你真的想用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中继服务，比如弹性的电子邮件

这里还有到官方SmtpJS.com网站的链接，在那里你可以找到所有你需要的例子，以及你可以创建安全令牌的地方。

我希望有人觉得这些细节有用。快乐的编码。