如何在Strapi中使用SendGrid实现邮件图片附件功能？

常见原因与对应解决方案 #

1. 本地URL无法被外部邮件客户端访问 #

你代码里硬写了http://localhost:1337，这个地址仅本地服务器能访问，外部邮件客户端（如Gmail、Outlook）无法连接，导致图片加载失败。

修复方法：
用Strapi配置的服务器地址动态生成URL，替换硬编码的localhost：

const serverUrl = strapi.config.get('server.url') || 'http://localhost:1337'; // 优先读取配置中的公网地址
// 替换html中的图片地址
html: `<img alt="image in email" src="${serverUrl}${result.attachment.formats.medium.url}" />`,

部署到线上时，记得在Strapi的config/server.js里将url配置为你的公网域名，比如https://your-strapi-domain.com。

2. 图片权限未设置为公开 #

Strapi默认上传的媒体文件若未开启公共权限，外部访问会返回403错误，邮件客户端无法获取图片。

检查与设置：

• 进入Strapi后台 → 设置 → 角色与权限 → 公共角色
• 找到「上传」权限组，确保find和findOne权限已勾选并保存

3. 外链图片被邮件客户端拦截 #

多数邮件服务商默认拦截外部图片，改用内嵌图片可彻底解决此问题。Strapi邮件插件支持通过attachments选项添加内嵌资源，修改后的代码如下：

import fs from 'fs';
import path from 'path';

export default {
  async afterCreate(event) {
    const { result } = event;
    // 拼接本地图片存储路径（Strapi默认上传文件存于public/uploads/）
    const imageRelativePath = result.attachment.formats.medium.url.replace('/uploads/', '');
    const imagePath = path.join(strapi.dirs.static.public, 'uploads', imageRelativePath);
    
    try {
      await strapi.plugins["email"].services.email.send({
        to: `myemail@mail.com`,
        from: "noreply@mail.com",
        subject: `${result.messageSubject}`,
        text: `${result.message}

credits:

Name: ${result.name}
Mobile: ${result.phone}
E-mail: ${result.email}`,
        html: `<img alt="image in email" src="cid:email-embedded-image" />`, // 用cid引用内嵌图片
        attachments: [
          {
            filename: result.attachment.name,
            path: imagePath,
            cid: 'email-embedded-image' // 与html中的cid值对应
          }
        ]
      });
    } catch (err) {
      console.log(err);
    }
  },
};

额外检查点 #

• 打印console.log(result.attachment)确认字段结构，若attachment是多文件数组，需改为result.attachment[0].formats.medium.url取首个图片
• 把图片URL复制到浏览器测试加载，排除路径错误或权限问题

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