Brevo配置设置

在编写发送邮件的函数之前，您首先需要配置Brevo，以便能够获取到您的API密钥。

1. 访问Brevo官网并创建一个免费账户。

2. 在设置过程中，系统会要求您输入发件人邮箱地址。请确保输入的是您的Gmail地址。系统会发送一封邮件，其中包含用于验证该地址所属权的链接。

3. 验证通过后，进入控制面板，在右上角点击您的个人资料名称，然后从下拉菜单中选择SMTP & API选项。

4. 进入API密钥页面，点击生成新的API密钥。给这个密钥起个名字，比如“MyWebApp”。

将生成的API密钥复制出来，并安全地保存在项目根目录下的.env文件中：

# .env文件
EMAIL_USER = yourverifiedemail@gmail.com
BREVO_API_KEY = xkeysib-your-generated-api-key-goes-here

创建发送邮件的函数

现在您已经获得了API密钥，并设置了环境变量，接下来就要开始编写后端代码了。

创建一个名为utils/email.js的文件。

首先，确保能够读取.env文件，这样就能轻松访问之前生成的配置信息：

require("dotenv").config();

// 我们将定义这个函数，让它能够接受动态参数
const sendEmail = async (options) => {
  const brevoApiKey = process.env.BREVO_API_KEY;
  const senderEmail = process.env.EMAIL_USER;

  // 确保这些密钥确实存在
  if (!brevoApiKey || !senderEmail) {
    throw new Error("环境变量中缺少Brevo所需的配置信息。");
  }

接下来，你需要组织好要发送的数据结构。这个JSON对象会明确告诉Brevo是谁发送了这封邮件、谁收到了邮件，以及邮件的内容是什么。具体操作方法如下：

  const payload = {
    sender: {
      name: "我的超棒网页应用",
      email: senderEmail, // 必须与你在Brevo平台上验证过的电子邮件地址一致
    },
    to: [
      {
        email: options.email, // 收件人的动态电子邮件地址
      },
    ],
    subject: options.subject,
    htmlContent: options.html,
  };

在上面的代码中，payload对象将你的信息安全地封装起来。我们使用了options.email、options.subject和options(html)这些参数，这样就可以用同一个函数来处理欢迎邮件、密码重置通知等各种场景了。

现在，我们需要创建实际的网络请求，将数据发送到Brevo的后端服务器。我们将使用POST方法进行发送，而且在发送之前，数据必须被转换成JSON格式。

  try {
    const response = await fetch("https://api.brevo.com/v3/smtp/email", {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
        "api-key": brevoApiKey,
      },
      body: JSON.stringify(payload),
    });

    const result = await response.json();

    if (!response.ok) {
      throw new Error(`Brevo API错误：${JSON.stringify(result)}`);
    }

    console.log(`通过Brevo HTTP API成功将邮件发送给${options.email}！`);
  } catch (error) {
    console.error("错误详情：", error.message);
  }
};

module.exports = sendEmail;

在上面的代码中，如果数据发送成功，终端会显示相应的成功日志；但如果由于API密钥输入错误等原因导致发送失败，系统会抛出错误信息，帮助你找出问题所在。

将此功能集成到Express路由中

到目前为止，你已经成功构建了一个功能完善的邮件发送模块。接下来，让我们看看如何在实际的Express应用中使用它。

创建一个index.js文件，并设置一个简单的Express服务器路由：

const express = require("express");
const sendEmail = require("./utils/email");
const app = express();

app.use(express.json()); // 用于解析JSON格式的请求体

app.post("/api/signup", async (req, res) => {
  const { username, email } = req.body;

  // 1. 将用户信息保存到数据库中（为简洁起见，这里省略了具体实现步骤）

  // 2. 生成一个随机的OTP验证码
  const otp = Math.floor(100000 + Math.random() * 900000);

  // 3. 使用我们新开发的Brevo功能发送邮件
  try {
    await sendEmail({
      email: email,
      subject: "欢迎使用！这是您的验证码",
      html: `
        
欢迎来到我的超棒网页应用，${username}！
          
请使用以下验证码完成注册：
          
${otp}
          
此验证码将在10分钟后失效。
        
      },
    });

    res.status(201).json({ message: "用户信息已成功保存，邮件也已发送！" });
  } catch (error) {
    res.status(500).json({ error: "发送邮件失败。" });
  }
});

app.listen(8000, () => {
  console.log("服务器正在8000端口运行");
});

就这样！现在你可以从你的 React 或 Vue 前端代码中调用这个 /api/signup 端点，Brevo 的 REST API 会立即发送一封格式精美的电子邮件。

结论

作为开发者，遇到在本地可以正常运行、但在生产环境中会出现问题的漏洞是再平常不过的事情。但“邮件发送失败”这种错误却具有特殊的意义——它提醒我们：软件工程并不仅仅意味着编写规范的代码，更重要的是要理解底层基础设施、网络架构以及代码运行环境中的安全因素。

通过将 SMTP 协议替换为 REST API over HTTPS 这种架构模式，你不仅修复了一个漏洞，还成功实现了一种安全、免费且可靠的方案，使得你的应用程序能够绕过云服务提供的防火墙，而无需依赖 Nodemailer 这类复杂的第三方库。

如果你们读到了这里，我希望我已经成功地向你们说明了理解网络架构的重要性，以及如何利用 HTTP API 来安全地从网页应用中发送电子邮件。

感谢大家的阅读！