n8n邮件节点发送HTML邮件时，邮件内容被转义成文本的解决方案-N8N大学

你有没有遇到过这样的绝望时刻：在 n8n 里精心设计了一封 HTML 邮件，排版精美、图文并茂，结果点击“执行”后，收件人收到的却是一堆乱码般的 HTML 标签实体？原本的 <div> 变成了 <div>，样式全崩，美感全无。

作为 N8N大学的首席主编，笔者在 8 年的自动化实战中，没少被这种“转义”问题折腾。这其实不是 n8n 的 Bug，而是对“数据类型”理解的一个经典陷阱。今天，我们就来把这个问题彻底讲透，让你从此告别 HTML 邮件转义的烦恼。

问题复现：为什么我的 HTML 变成了“天书”？

这个问题通常发生在你尝试发送动态 HTML 内容时。比如，你从某个 API 获取了一段 HTML 模板，或者通过 HTML 模板 节点生成了内容，但在传入 Email 节点 时，n8n 默认将其作为普通字符串处理。

典型的场景如下：

你使用了 Code 节点 或 Set 节点 组装数据。
你将一段包含 <h1>、<p> 等标签的字符串赋值给某个字段（例如 EmailBody）。
在 Email 节点（无论是 SMTP 还是 Gmail 节点）中，你将该字段映射到 HTML 内容 的输入框。

执行后，你收到的邮件源代码看起来是这样的：

<h1>Hello World</h1><p>这是一段测试文本</p>

这就是典型的“双重转义”问题。n8n 把你的 HTML 代码当成了纯文本显示，而不是渲染它。

原因分析：数据类型与 UI 的博弈

用大白话来说，n8n 的 Email 节点在处理“HTML 内容”这个参数时，需要接收一个明确的“HTML 字符串”，而不是一个“被包裹在字符串里的 HTML 字符串”。

为什么会这样？主要有两个原因：

UI 输入框的特性： 在 n8n 的节点参数 UI 中，默认输入是文本类型。如果你直接将一段 HTML 代码粘贴进去，系统为了安全（防止 XSS 攻击），或者因为数据类型的不匹配，可能会进行实体编码（Entity Encoding）。
数据流转中的 JSON 序列化： 当你在 Code 节点中生成 HTML 字符串时，如果处理不当，数据在 JSON 序列化和反序列化过程中，特殊字符（如 < 和 >）会被转义。

简而言之，n8n 并没有“变坏”，它只是在严格遵守数据类型的规则，而你可能在某个环节传递了一个“字符串的字符串”。

解决方案：3 种硬核修复方案

针对这个问题，N8N大学总结了三种从简单到进阶的解决方案。请根据你的具体场景选择。

方案一：善用“切换”开关（最简单）

这是很多新手容易忽略的功能。n8n 的许多输入框（包括 Email 节点的 HTML 内容框）右侧都有一个 Expression / JSON / String 的切换按钮，或者是一个 “切换” 开关。

操作步骤：

打开 Email 节点 的配置。
找到 HTML 内容 (HTML Content) 字段。
点击输入框右侧的 切换 (Toggle) 按钮（通常是一个小的圆形图标或下拉菜单）。
选择 Expression (表达式) 模式。
此时，输入框会变成紫色。在框中输入 {{ $json.your_html_field }}。

原理解析： 当你使用表达式模式时，n8n 会解析变量并将原始内容直接注入到邮件中，而不是将其作为文本字符串处理。这是最快解决 80% 问题的方法。

方案二：Code 节点预处理（最稳健）

如果你的 HTML 内容来自外部 API，或者需要动态拼接，强烈建议在进入 Email 节点前，使用 Code 节点 进行显式处理。

操作步骤：

在 Email 节点之前添加一个 Code 节点（JavaScript）。
在代码编辑器中，确保你返回的 JSON 对象中包含 HTML 字段，且该字段是标准的字符串格式。

示例代码：

return [{
  json: {
    // 假设你的 HTML 来自 API 或拼接
    html_content: `<div style="color: red;">Hello, N8N User</div>`
  }
}]

接着，在 Email 节点中，使用表达式引用：{{ $json.html_content }}。关键在于，Code 节点返回的字符串必须是干净的，不要在字符串外再套一层引号。

方案三：使用原生 HTML 模板节点（进阶）

n8N 官方提供了一个 HTML 模板 (HTML Template) 节点（部分版本或集成包中），或者你可以使用 Markdown 节点转换。

如果你的流程非常复杂，建议使用专门的模板节点。将 HTML 代码直接写在模板节点的编辑区，然后将生成的 Output 传给 Email 节点。这种方式能最大程度保证结构的完整性。

避坑指南：这些细节决定成败

在实战中，除了转义问题，还有几个细节容易导致邮件发送失败或显示异常：

图片链接必须是公网可访问的： 邮件里的图片尽量使用绝对路径（如 https://example.com/img.png）。不要试图在 HTML 里嵌入 Base64 图片，很多邮件客户端（如 Outlook）会拦截或无法显示。
CSS 内联化： 邮件客户端对 CSS 的支持非常有限。不要依赖外部 CSS 文件或 <style> 标签。尽量使用 HTML 的 style 属性（内联样式），例如 <div style="color: blue;">。
文本备份： 在 Email 节点中，不要忽略 文本内容 (Text Content) 字段。虽然你发送的是 HTML 邮件，但很多用户或邮件系统会优先显示纯文本。建议将 HTML 内容去除标签后作为纯文本填入，或者简单写一段摘要。

FAQ 问答

Q1: 为什么我使用了表达式，邮件里还是出现了双引号或转义字符？
A: 这通常是因为你在 Code 节点或上游数据中，对 HTML 字符串进行了多余的 JSON.stringify 处理，或者在拼接字符串时手动添加了转义符。请检查上游数据源，确保传递的是原始 HTML 字符串。

Q2: 发送 HTML 邮件时，Gmail 节点和 SMTP 节点有区别吗？
A: 在 n8n 的配置上没有区别，两者都支持 HTML 参数。区别在于 Gmail 节点需要 OAuth 认证且有发送配额限制，而 SMTP 节点更灵活但需要你配置具体的服务器参数（SSL/TLS 端口）。对于 HTML 内容的处理逻辑是一致的。

Q3: 如何调试我生成的 HTML 内容？
A: 在 n8n 中，你可以使用 HTTP Request 节点 将生成的 HTML 发送到 webhook.site，查看原始的 Payload 数据。或者使用 Code 节点 的 console.log() 功能，在 n8n 的执行日志中查看变量的具体值。

总结与资源

解决 n8n 邮件节点 HTML 内容被转义的核心在于：明确数据类型，善用表达式模式。不要让 n8n 把你的精心设计当作普通文本处理。

如果你正在构建复杂的自动化邮件营销流程，建议使用方案二（Code 节点）来构建 HTML 模板，这样既能保证灵活性，又能避免转义陷阱。

更多 n8n 避坑指南和高级实战教程，请持续关注 N8N大学 (n8ndx.com)。如果你在实践中遇到其他棘手问题，欢迎在评论区留言，笔者会亲自解答。

n8n邮件节点发送HTML邮件时，邮件内容被转义成文本的解决方案

问题复现：为什么我的 HTML 变成了“天书”？

原因分析：数据类型与 UI 的博弈