nodemailer微服务发送qq邮件
最近做公司网站时遇到一个问题,联系我们,电话?qq?还是邮件吧?那么问题来了,怎么发邮件呢?
找了一下,发现大体就2种方式,一是使用微软提供邮箱,但需要特定条件,还需用户提供邮箱地址,同时还要用户填写接收邮箱,于是产品部说了,你这个用户体验。。。
没办法,于是我找到了nodemailer,利用后台服务发送qq邮件。
demo必备:node环境、两个qq邮箱(一个发,一个接)
注:接的邮箱需要去qq开启smtp权限
开启会短信获取smtp码(2毛钱)
一、搭建node微服务
进入微服务目录,在终端npm i nodemailer
接着创建微服务启动js(serve.js),目录如下
serve.js
'use strict';
const express = require('express');
const http = require('http');
const path = require('path');
const bodyParser = require('body-parser');
const nodemailer = require('nodemailer');
let emailSend =require('./email/emailSend.js')
var app = express();
app.use(express.static(path.join(__dirname, 'public')));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
extended: true
}));
var server = app.listen(3000, function () {
console.log('服务启动')
})
// 设置跨域
app.all('*', function (req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header('Access-Control-Allow-Headers', 'Content-Type, Content-Length, Authorization, Accept, X-Requested-With , yourHeaderFeild');
res.header("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS");
res.header("X-Powered-By", ' 3.2.1')
res.header("Content-Type", "application/json;charset=utf-8");
next();
});
// 发送邮件
app.post('/sendemail', function (req, res) {
emailSend.sendemail(req,res)
})
email目录下的emailSend.js服务
'use strict';
const express = require('express');
const bodyParser = require('body-parser');
const nodemailer = require('nodemailer');
var app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
extended: true
}));
var emailSend={
sendemail: function (req, res) {
let visitorName = req.body.visitorName;
let companyName = req.body.companyName;
let telephone = req.body.telephone;
let mailbox = req.body.mailbox;
let requirement = req.body.requirement;
res.header("Access-Control-Allow-Methods", "DELETE,PUT,POST,GET,OPTIONS");
let transporter = nodemailer.createTransport({
service: 'qq', // 使用内置传输发送邮件 查看支持列表:https://nodemailer.com/smtp/well-known/
port: 465, // SMTP 端口
secureConnection: true, // 使用 SSL
auth: {
user: '3471****@qq.com',
// 这里密码不是qq密码,是你设置的smtp授权码
pass: 'fxv****uowdaeg',
}
});
let mailOptions = {
from: '3471*****@qq.com', // 发送邮箱必须与上面开通ssl的邮箱一致
to: '157*****6@qq.com', // 接收邮箱
subject: '邮件测试', // 标题
//text: 'Hello world?', // text html二者选一
html: "<div>姓名:" + visitorName + "</div>" +
"<div>公司名称:" + companyName + "</div>" +
"<div>联系电话:" + telephone + "</div>" +
"<div>电子邮箱:" + mailbox + "</div>" +
"<div>要求建议:</div>" +
"<div>" + requirement + "</div>"
};
transporter.sendMail(mailOptions, function(error, info){
if (error) {
console.log('发送失败!邮箱是否正确');
res.send({state:210,result:'服务正忙!请等稍后再试!'})
}else{
console.log(info);
res.send({state:200,result:'提交成功!请等候我司联系!'})
}
});
}
}
module.exports=emailSend
如此简单的node服务就搭好了
只需在终端node serve.js启动服务就可以了
二、前端调用email接口
这里我做了一个小封装useEmail.js
var ntc_sendEmail=function(obj){
var html='<div class="modal fade" id="emailModal" tabindex="-1" role="dialog" aria-hidden="true">'+
'<div class="modal-dialog email-modal">'+
'<div class="modal-content">'+
'<div class="form-box">'+
'<div class="form-title" style="font-size:24px;padding-right:55px;letter-spacing: 2px;">马上联系</div>'+
'<div required class="input-item">'+
'<input type="text" id="visitorName" placeholder="请输入姓名">'+
'<div class="input-item-icon-box">'+
'<img src="/img/emailModal/name.png" alt="">'+
'<span>您的姓名:</span>'+
'</div>'+
'<div class="wrong-tip"></div>'+
'</div>'+
'<div class="input-item">'+
'<input type="text" id="companyName" placeholder="请输入公司名称">'+
'<div class="input-item-icon-box">'+
'<img src="/img/emailModal/gongsi.png" alt="">'+
'<span>公司名称:</span>'+
'</div>'+
'</div>'+
'<div required class="input-item">'+
'<input type="text" id="telephone" placeholder="请输入联系电话">'+
'<div class="input-item-icon-box">'+
'<img src="/img/emailModal/tellphone.png" alt="">'+
'<span>联系电话:</span>'+
'</div>'+
'<div class="wrong-tip"></div>'+
'</div>'+
'<div class="input-item">'+
'<input type="text" id="mailbox" placeholder="请输入电子邮箱">'+
'<div class="input-item-icon-box">'+
'<img src="/img/emailModal/youxiang.png" alt="">'+
'<span>电子邮箱:</span>'+
'</div>'+
'<div class="wrong-tip"></div>'+
'</div>'+
'<div class="input-item textarea-box">'+
'<textarea name="" id="requirement" placeholder="请输入要求或建议" cols="30" rows="15"></textarea>'+
'<div class="input-item-icon-box">'+
'<img src="/img/emailModal/yaoqiu.png" alt="">'+
'<span>具体要求:</span>'+
'</div>'+
'</div>'+
'<div style="text-align: center;padding-right:55px;">'+
'<a class="apply-button" type="button">提交</a>'+
'</div>'+
'</div>'+
'</div>'+
'</div>'+
'</div>'
$('body').append(html);
$('#requirement').focus(function(){
$('#requirement').parent().addClass('text-focus')
});
$('#requirement').blur(function(){
$('#requirement').parent().removeClass('text-focus')
})
$('.apply-button').on('click',function(){
var visitorName = $('#visitorName').val();
var companyName = $('#companyName').val();
var telephone = $('#telephone').val();
var mailbox = $('#mailbox').val();
var requirement = $('#requirement').val();
// 联系人姓名验证
if(visitorName==''){
$('#visitorName').siblings('.wrong-tip').html('联系人不能为空!')
return false;
}
// 电话验证
if(telephone==''){
$('#telephone').siblings('.wrong-tip').html('联系电话不能为空!')
return false;
}
else if (!(/^1[3456789]\d{9}$/.test(telephone))) {
$('#telephone').siblings('.wrong-tip').html('输入正确电话号码!')
return false;
}
// 邮箱验证
// if(telephone !==''){
// if (!(/^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/.test(mailbox))) {
// $('#mailbox').siblings('.wrong-tip').html('输入正确格式的邮箱或不填!')
// return false;
// }
// }
$.ajax(
{
url: 'http://localhost:3000/sendemail',
type: 'post',
dataType: 'json',
data: {
visitorName: visitorName,
companyName: companyName,
telephone: telephone,
mailbox: mailbox,
requirement: requirement
},
success: function (data) {
alert(data.result)
},
error: function (error) {
alert(error.result)
}
}
)
$("#emailModal").modal('hide')
// 初始化输入框
visitorName='';
companyName='';
telephone='';
mailbox='';
requirement='';
})
}
接下来只需在页面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<button id="contactUs">
联系我们
</button>
</body>
<script src="./jquery-1.12.0.min.js"></script>
<script src="./useEmail.js"></script>
<script>
$('#contactUs').on('click',function(){
ntc_sendEmail()
})
</script>
</html>
在服务中看到中一串代表发送成功了,马上去qq邮箱验证一下吧!!!
**
样式从简,小伙伴们自行书写吧!(产品:界面一定要好看哦(=_=)!)