node 实现发邮件的功能

时间:2022-04-15 19:00:19

本项目基于vue的项目来讲解:

  • 准备一个QQ号,打开你的QQ邮箱,设置-> 账户
    node 实现发邮件的功能

将SMTP服务设置 为 开启状态 ,并且点击生成授权码,将授权码保存好,后面会用到的

  • email.vue 的代码
<template>
  <div class="email">
    <form>
      <div class="input">
        <label for="name" class='label'>姓名</label>
        <input type="text" name="name" v-model.trim="formData.name" id="name" class="value">
      </div>
      <div class="input">
        <label for="name" class='label'>电话</label>
        <input type="text" name="phone" v-model.trim="formData.phone" id="phone" class="value">
      </div>
      <button class="send" type="submit" @click.stop.prevent="send(formData)">发送邮件</button>
    </form>
  </div>
</template>
<script> import axios from 'axios'; export default { name: 'email', data() { return { formData: { name: '', phone: '', }, }; }, methods: { send(data) { if (!data.name) { alert('请输入的你的姓名'); return false; } else if (!data.phone) { alert('请输入的你的电话'); return false; } else { axios({ method: 'post', url: '/api/email', // 后面会讲解 data: data, }); } }, }, }; </script>
<style lang="scss" scoped> .input { display: flex; .label { width: 0.3rem; } .value { flex: 1; border: 1px solid #dfdfdf; } } </style>
  • build/dev-server.js(新版本vue-cli 已经没有dev-server.js,只有老版本才有)添加新的代码
// 加载body-parser 处理post提交过来的数据
var nodemailer = require("nodemailer");
var bodyParser = require('body-parser'); 
var app = express()
var apiRoutes = express.Router()

// bodyParser 设置,自动会在req上面添加
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());
apiRoutes.post('/email', function(req, res) {
    // console.info('req', req)
    // bodyParser 可以获取提交的数据,都保存在body上面
    var text = `这个人姓名叫${req.body.name }电话是${req.body.phone},欢迎骚扰`
    if (req.body.name && req.body.phone) {
        res.json({
            iRet: 1,
            info: 'ok',
        });

        // Use Smtp Protocol to send Email
        var transporter = nodemailer.createTransport({
            //https://github.com/andris9/nodemailer-wellknown#supported-services 支持列表
            service: 'qq',  // 标注为QQ,不能为其他
            port: 465, // SMTP 端口
            secureConnection: true, // 使用 SSL
            auth: {
                user: "xxxx@qq.com",
                //这里密码不是qq密码,是你设置的smtp密码(授权码)
                pass: "*********"
            }
        });

        // setup e-mail data with unicode symbols
        var mailOptions = {
            to: "yyyyyyy@qq.com", // 接受者
            from: "xxxx@qq.com",  // 这里的from和上面的user 账号一样的
            subject: '我在学习发邮件', // 标题
            //text和html两者只支持一种
            text: text, // 标题
            // html: '<b>Hello world ?</b>' // html 内容
        };

        transporter.sendMail(mailOptions, function(error, info) {
            if (error) {
                return console.log(error);
            }
            console.log('Message sent: ' + info.response);
            transporter.close();
        });

    } else {
        res.json({
            iRet: -1,
            info: 'error',
        });
        return;
    }
});
app.use('/api', apiRoutes) 
// 前端调取的url:'/api/email';如果这里app.use('/', apiRoutes),前端调取的url:'/email'

查看资料 :
1. http://service.mail.qq.com/cgi-bin/help?subtype=1&&no=1001256&&id=28
2. https://www.jianshu.com/p/ee200a67853c
3. https://www.cnblogs.com/pingfan1990/p/4864822.html