如何使用Node.js实现发送邮件功能

在我们开发过程中,很多时候都需要用到发送邮件的功能,比如用户注册验证、密码重置、通知提醒等等,本篇文章将为大家介绍如何使用 nodeJS 实现邮件的发送功能

初始化项目

首先我们初始化一个 node 项目

csharp 复制代码
npm init -y

为了方便使用 ESModule 语法,我们在 package.json 中加个字段

js 复制代码
 "type": "module",

nodemailer 用法

node 中发送邮件我们可以安装使用nodemailer包,这里是它的官网地址

首先安装它

js 复制代码
npm install nodemailer

如果我们想用它发送邮件,我们还需要一个授权码,这里以 qq 邮箱为例教大家如何获取授权码

登录 QQ 邮箱 → 设置 → 账号 → POP3/IMAP/SMTP/...开启。然后根据提示发送短信之后,即可获取授权码

然后新建一个文件sendemail.js来使用它

js 复制代码
import nodemailer from "nodemailer";

const transporter = nodemailer.createTransport({
  host: "smtp.qq.com",
  port: 587,
  secure: false,
  auth: {
    user: "xxx@qq.com", //我的邮箱
    pass: "xxx", //授权码
  },
});

async function sendEMail() {
  const info = await transporter.sendMail({
    from: "xxx@qq.com",//发送人邮箱
    to: "xxx@qq.com",//发送给谁
    subject: "你好",//标题
    text: "hhhhh",//内容
  },*);

  console.log("邮件发送成功:", info.messageId);
}

sendEMail();

其中transporter是一个可以发送邮件的对象,如果你已经有一个传输器对象,则可以使用它来发送任意数量的邮件。调用它的 sendMail 方法则可以实现邮件的发送。

我们来执行一下看看效果

执行成功后我们便收到了发送来的邮件

不仅如此,它还可以发送 html 邮件,你可以直接在使用 html 字符串,但是这样不太好做出炫酷的邮件效果

js 复制代码
async function sendEMail() {
  const info = await transporter.sendMail({
    from: "xxx@qq.com",//发送人邮箱
    to: "xxx@qq.com",//发送给谁
    subject: "你好",//标题
    html: "<p>hhhh</p>",//内容
  },*);

  console.log("邮件发送成功:", info.messageId);
}

因此我们可以新建一个 html 文件,然后使用 node 的文件系统(fs)读取一下即可,这里我们随便找了一个炫酷的 html 页面,命名为ikun.html

html 复制代码
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      * {
        padding: 0;
        margin: 0;
      }

      @media screen and (max-width: 600px) {
        #kun {
          transform: scale(0.5);
        }
      }

      :root {
        --armLength: 110px;
      }

      .app {
        width: 100vw;
        height: 100vh;
        background-image: url("https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/00b660e0954f40b5b4db00090ab1e14c~tplv-k3u1fbpfcp-watermark.image?");
        background-size: 100% 100%;
        background-repeat: no-repeat;
        display: flex;
        justify-content: center;
        padding-top: 120px;
      }

      .app #kun {
        width: fit-content;
        height: fit-content;
        position: relative;
      }

      .app #kun .head {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        bottom: 195px;
        animation: headmove 1s ease infinite;
        z-index: 1;
        width: 120px;
        height: 120px;
        border-radius: 50%;
        background: #d1b4a8;
      }

      .app #kun .head::after {
        content: "";
        width: 20px;
        height: 80px;
        background-color: #d1b4a8;
        position: absolute;
        bottom: -70px;
        left: 50%;
        transform: translateX(-50%);
      }

      .app #kun .hair {
        width: 150px;
        height: 100px;
        display: flex;
        position: absolute;
        top: -25px;
        left: 50%;
        transform: translateX(-50%);
        z-index: 1;
      }

      .app #kun .hair-l {
        width: 50%;
        height: 100%;
        background-image: linear-gradient(to right, lightgrey, grey);
        border-radius: 65px 21px 76px 14px / 90px 17px 111px 26px;
      }

      .app #kun .hair-r {
        width: 50%;
        height: 100%;
        background-image: linear-gradient(to left, lightgrey, grey);
        border-radius: 33px 85px 29px 99px / 26px 99px 62px 147px;
      }

      .app #kun .kbody {
        position: relative;
        z-index: 2;
        -webkit-clip-path: polygon(17% 16%, 63% 29%, 75% 100%, 0% 100%);
        clip-path: polygon(17% 16%, 63% 29%, 75% 100%, 0% 100%);
        width: 150px;
        height: 230px;
        background-color: #333;
        animation: bodymove 1s ease infinite;
        transform-origin: center;
        display: flex;
        justify-content: center;
        align-items: center;
      }

      .app #kun .kbody span {
        color: #fff;
        font-size: 350px;
        transform: rotate(10deg);
      }

      .app #kun .arms {
        width: 72%;
        height: 100%;
        position: absolute;
        top: 66px;
        left: 12%;
        animation: armmove 1s ease infinite;
      }

      .app #kun .arm {
        background-color: #333;
        position: absolute;
        top: 10px;
        z-index: 1;
        transform-origin: center top;
        width: 30px;
        height: var(--armLength);
      }

      .app #kun .arm-l {
        left: 0;
        transform: rotate(50deg);
        border-radius: 0 0 30px 30px;
      }

      .app #kun .arm-l::after {
        content: "";
        position: absolute;
        width: 26px;
        height: 80px;
        border-radius: 0 0 30px 30px;
        background-color: #333;
        left: 0;
        bottom: -70px;
        transform-origin: center top;
        transform: rotate(-100deg);
      }

      .app #kun .arm-r {
        right: 0px;
        transform: rotate(-20deg);
        border-radius: 0 0 30px 30px;
      }

      .app #kun .arm-r::after {
        content: "";
        position: absolute;
        width: 26px;
        height: 80px;
        border-radius: 0 0 30px 30px;
        background-color: #333;
        left: 0;
        bottom: -70px;
        transform-origin: center top;
        transform: rotate(100deg);
      }

      .app #kun .leg {
        width: 40px;
        height: 128px;
        background-color: #877785;
        position: absolute;
        bottom: -110px;
        z-index: 1;
        transform-origin: center top;
      }

      .app #kun .leg-l {
        left: 12px;
        transform: rotate(20deg);
      }

      .app #kun .leg-l::after {
        content: "";
        position: absolute;
        width: 38px;
        height: 120px;
        background-color: #877785;
        border-radius: 0 0 30px 30px;
        left: 0;
        bottom: -110px;
        transform-origin: center top;
        transform: rotate(-10deg);
      }

      .app #kun .leg-r {
        right: 50px;
        transform: rotate(-30deg);
      }

      .app #kun .leg-r::after {
        content: "";
        position: absolute;
        width: 38px;
        height: 132px;
        background-color: #877785;
        border-radius: 0 0 30px 30px;
        left: 0;
        bottom: -126px;
        transform-origin: center top;
        transform: rotate(10deg);
      }

      @keyframes headmove {
        25% {
          bottom: 210px;
        }
        50% {
          bottom: 195px;
        }
        75% {
          bottom: 170px;
        }
      }

      @keyframes armmove {
        25% {
          width: 92%;
          top: 60px;
          left: 11%;
        }
        50% {
          width: 72%;
          top: 66px;
          left: 12%;
        }
        75% {
          width: 81%;
          top: 80px;
          left: 14%;
        }
      }

      @keyframes bodymove {
        25% {
          -webkit-clip-path: polygon(23% 13%, 98% 10%, 75% 100%, 0% 100%);
          clip-path: polygon(23% 13%, 98% 10%, 75% 100%, 0% 100%);
        }
        50% {
          -webkit-clip-path: polygon(17% 16%, 63% 29%, 75% 100%, 0% 100%);
          clip-path: polygon(17% 16%, 63% 29%, 75% 100%, 0% 100%);
        }
        75% {
          -webkit-clip-path: polygon(24% 27%, 90% 38%, 75% 100%, 0% 100%);
          clip-path: polygon(24% 27%, 90% 38%, 75% 100%, 0% 100%);
        }
      }
    </style>
  </head>
  <body>
    <div class="app">
      <div id="kun">
        <div class="head">
          <div class="hair">
            <div class="hair-l"></div>
            <div class="hair-r"></div>
          </div>
        </div>

        <div class="kbody">
          <span>Y</span>
        </div>

        <div class="arms">
          <div class="arm arm-l"></div>
          <div class="arm arm-r"></div>
        </div>

        <div class="leg leg-l"></div>
        <div class="leg leg-r"></div>
      </div>

      <div class="triangle"></div>
    </div>
  </body>
</html>

然后在sendemail.js中读取使用

js 复制代码
import nodemailer from "nodemailer";
import fs from "fs";
const transporter = nodemailer.createTransport({
  host: "smtp.qq.com",
  port: 587,
  secure: false,
  auth: {
    user: "xxx@qq.com", //我的邮箱
    pass: "xxx", //授权码
  },
});

async function sendEMail() {
  const info = await transporter.sendMail({
    from: "xxx@qq.com",//发送人邮箱
    to: "xxx@qq.com",//发送给谁
    subject: "你好,爱坤",//标题
    html: fs.readFileSync("./static/ikun.html"),
  },*);

  console.log("邮件发送成功:", info.messageId);
}

sendEMail();

最后执行以下看看效果

非常好用,ok到这里我们就完成了一个简单的邮件发送功能,如果对本篇文章感兴趣的话就点个赞吧~

参考代码: code.juejin.cn/pen/7200316...

相关推荐
PanZonghui3 分钟前
Centos项目部署之安装数据库MySQL8
linux·后端·mysql
Victor3566 分钟前
MySQL(119)如何加密存储敏感数据?
后端
zhanshuo7 分钟前
不依赖框架,如何用 JS 实现一个完整的前端路由系统
前端·javascript·html
火柴盒zhang8 分钟前
websheet在线电子表格(spreadsheet)在集团型企业财务报表中的应用
前端·html·报表·合并·spreadsheet·websheet·集团财务
khalil10 分钟前
基于 Vue3实现一款简历生成工具
前端·vue.js
拾光拾趣录17 分钟前
浏览器对队头阻塞问题的深度优化策略
前端·浏览器
用户39661446871917 分钟前
TypeScript 系统入门到项目实战-慕课网
后端
用户81221993672217 分钟前
[已完结]后端开发必备高阶技能--自研企业级网关组件(Netty+Nacos+Disruptor)
前端
万少22 分钟前
2025中了 聊一聊程序员为什么都要做自己的产品
前端·harmonyos