如何使用flutter_email_sender在Flutter/Dart安卓应用中发送带嵌入图片的邮件?
解决Flutter中使用flutter_email_sender发送内嵌图片邮件的问题
好的,咱们来搞定这个内嵌图片的邮件问题。你当前用base64转成data URI的方式之所以失效,核心原因是大部分主流邮件客户端(比如Gmail、Outlook、系统默认邮件应用)出于安全策略,会屏蔽HTML中的data URI图片,这不是flutter_email_sender插件的问题,而是邮件生态的普遍限制。
不过别担心,我们可以用邮件行业标准的附件+CID引用方式来实现内嵌图片,这种方法兼容性拉满,几乎所有客户端都支持。
具体修改方案
1. 原理说明
把图片作为邮件附件添加,然后在HTML内容中通过cid:文件名(CID即Content-ID)来引用这个附件,邮件客户端会自动把附件渲染成内嵌图片,而不是显示成单独的附件项。
2. 修改后的代码
import 'package:path/path.dart' as path; // 需要导入path包处理文件路径 // 提取图片文件名(比如从/data/src/0/cache/hi.jpg中得到hi.jpg) String imageFileName = path.basename(DataUser.pathImage); // 构建HTML内容,用cid引用图片 String result = "<p>${DataUser.emailText.split("\n").join("<br>")}<br>"; result += "<img src=\"cid:$imageFileName\" alt=\"Embedded Image\" />"; result += "</p>"; // 合并原有附件和图片附件(如果DataUser.filePath是List<String>类型) List<String> allAttachments = []; if (DataUser.filePath != null) { allAttachments.addAll(DataUser.filePath); } allAttachments.add(DataUser.pathImage); final Email email = Email( body: result, subject: "Pointage", recipients: DataUser.adresse, attachmentPaths: allAttachments, isHTML: true, ); await FlutterEmailSender.send(email);
3. 关键注意事项
- 确保
path包已经在pubspec.yaml中添加(如果没加,执行flutter pub add path)。 - 有些邮件客户端可能会把图片同时显示为内嵌图和单独附件,这是客户端的行为差异,无法完全避免,但内嵌图的显示是正常的。
- 如果你的测试设备上的默认邮件应用还是不显示,建议换Gmail、Outlook等第三方客户端测试,系统默认邮件应用可能有更严格的限制。
备选方案(如果上述方法仍有问题)
如果flutter_email_sender调用系统邮件应用的方式不符合你的需求,可以考虑使用mailer插件直接通过SMTP发送邮件。这种方式不需要依赖系统邮件应用,能完全控制邮件的MIME结构,内嵌图片的兼容性更稳定,但需要配置SMTP服务器信息(比如Gmail的SMTP、企业邮箱的SMTP等)。
内容的提问来源于stack exchange,提问作者titicplusplus




