如何使用EmailJS发送HTML格式邮件？

1. 在EmailJS后台配置HTML邮件模板 #

• 登录EmailJS后台，进入「Email Templates」页面
• 点击创建新模板，切换到HTML编辑模式（而非默认的可视化编辑器）
• 将你需要发送的HTML代码直接粘贴到编辑框中：

  <div>
      <p>Please click below</p>
      <br/>
      <a href="http://website.com/path/to/link">Click me!</a>
  </div>
  

• 完成后保存模板，记录下该模板的模板ID（在模板详情页可查看）

2. 前端调用EmailJS SDK发送邮件 #

• 首先引入EmailJS官方提供的SDK脚本（可在EmailJS后台文档中获取最新版本的引入代码）
• 初始化EmailJS（替换为你的用户ID，可在EmailJS后台「Account」页面获取）：

  emailjs.init('你的用户ID');
  

• 编写发送邮件的函数，调用时传入你的服务ID和之前记录的模板ID：

  function sendHtmlEmail() {
      // 第三个参数为模板变量，这里HTML内容已固定在模板中，传空对象即可
      emailjs.send('你的服务ID', '你的模板ID', {})
          .then((response) => {
              console.log('邮件发送成功!', response.status, response.text);
          }, (err) => {
              console.log('邮件发送失败:', err);
          });
  }
  

3. 动态HTML内容的扩展（可选） #

如果需要动态生成HTML内容，可将HTML作为变量传入模板：

• 在模板中使用变量占位符，比如：

  <div>{{dynamic_html}}</div>
  

• 调用时传入对应的变量值：

  emailjs.send('你的服务ID', '你的模板ID', {
      dynamic_html: '<p>动态生成的内容</p><a href="http://xxx.com">动态链接</a>'
  })
  

注意事项 #

• 确保模板的收件人、发件人等基础配置正确
• 部分邮箱服务商可能会对HTML邮件进行过滤，建议用不同邮箱测试接收效果
• 若使用动态HTML变量，需确保传入的HTML代码符合EmailJS的模板语法规范

内容的提问来源于stack exchange，提问作者OldLavyGenes474