Base64 图像无法在 Gmail 和 Outlook 中呈现答案

【问题标题】：Base64 Image does not render in Gmail & OutlookBase64 图像无法在 Gmail 和 Outlook 中呈现
【发布时间】：2022-01-27 14:18:41
【问题描述】：

我们正在使用 SendGrid 将电子邮件发送到所有平台，即 Gmail、Outlook 等。

还使用 SendGrid 动态模板设计了电子邮件模板。

我们有 base64 图像，我们在电子邮件模板中使用了它。但是，图像不会在 SendGrid 电子邮件模板中呈现。

此外，我们已通过将邮件发送到 Gmail 和 Outlook 对其进行了测试，但是，base64 图像也未呈现。

由于图片没有上传到任何地方，编辑器将图片保存为base64编码的图片。

<img alt="" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA4QAAAFKCAIAAADKUQaBAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAP+lSURBVHhepP1p32zb"/>

能否请任何人向我建议在所有平台 Gmail、Outlook、SendGrid 等的电子邮件模板中呈现 Base64 图像的解决方案。

【问题讨论】：

这不是 base 64 字符串
@logeshpalani31 我刚刚测试了它。它解码得很好，并且 png 在 mspaint 中打开得很好。用户应该尝试使用不是单一透明颜色的图像。

标签： google-cloud-platform outlook base64 sendgrid email-templates

【解决方案1】：

你正在做的工作正常。问题是你的图片是单色的，而且颜色是透明的。

如果您创建此 html 文件并在浏览器中打开它，您可以验证这一点：

<body style="background-color:green;">
Text before
<img style="border:1px solid black;" alt="" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA4QAAAFKCAIAAADKUQaBAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAP+lSURBVHhepP1p32zb"/>
Text after
</body>

【讨论】：

【解决方案2】：

Outlook 不支持 base64 图像。相反，您需要通过附加文件来嵌入图像，然后使用消息正文中的cid: 属性引用它。

【讨论】：