使用邮箱发送验证码

思路：用户注册的时候，输入邮箱，使用自己的邮箱给用户的邮箱发送验证码，验证码在后端程序发送，然后存到数据库里，当用户发送过来的时候读取出来比对。

设置自己邮箱的 SMTP

可以是 qq 邮箱或网易云。这里以 qq 邮箱举例。 登陆邮箱 --> 设置 --> 账户

然后开发后端逻辑

环境：npm i nodemailer express body-parser cors

var nodemailer = require("nodemailer");
var express = require("express");
var bodyparser = require("body-parser");
var cors = require("cors");
var app = express();
app.use(cors());
app.use(bodyparser.urlencoded({ extend: false }));

var transporter = nodemailer.createTransport({
  //邮件传输
  host: "smtp.qq.com", //qq smtp服务器地址
  secureConnection: false, //是否使用安全连接，对https协议的
  port: 465, //qq邮件服务所占用的端口
  auth: {
    user: "289483936@qq.com", //开启SMTP的邮箱，有用发送邮件
    pass: "pyyorvhngqkfbjid", //授权码
  },
});

app.post("/getlma", function(req, res) {
  //调用指定的邮箱给用户发送邮件
  var code = "";
  while (code.length < 5) {
    code += Math.floor(Math.random() * 10);
  }
  var mailOption = {
    from: "289483936@qq.com", // 发件人
    to: "2102193536@qq.com", //收件人
    subject: "XX注册校验码", //纯文本
    html: "<h1>欢迎注册XX系统，您本次的注册验证码为：" + code + "</h1>",
  };

  transporter.sendMail(mailOption, function(error, info) {
    if (error) {
      res.send("error");
      return console.info(error);
    } else {
      res.send("yes");
      console.info("Message send" + code);
    }
  });
});

app.listen(3000, function(err) {
  if (err) {
    console.info(err);
  } else {
    console.info("服务器开启成功。。。");
  }
});

最后前端

<input type="button" onclick="send()" id="emialcore" value="发送验证码" />
<input type="text" name="code" placeholder="请输入验证码..." id="code" />

// input
var code = document.getElementById("code");

var send = function() {
  // 获取验证码
  window
    .fetch("http://localhost:3000/getlma", {
      body: JSON.stringify({ suer: "宋宇" }), // must match 'Content-Type' header
      cache: "no-cache", // *default, no-cache, reload, force-cache, only-if-cached
      credentials: "same-origin", // include, same-origin, *omit
      headers: {
        "user-agent": "Mozilla/4.0 MDN Example",
        "content-type": "application/json",
      },
      method: "POST", // *GET, POST, PUT, DELETE, etc.
      mode: "cors", // no-cors, cors, *same-origin
      redirect: "follow", // manual, *follow, error
      referrer: "no-referrer", // *client, no-referrer
    })
    .then((res) => {
      console.log(res);
      return res.json();
    })
    .then((res) => {
      console.log(res);
    })
    .catch((err) => {
      console.log(err);
    });
};