如何使用emailjs-mime-parser解析含图片的多部分HTML邮件？

没问题！我来帮你搞定多部分邮件（带内嵌图片）的解析，生成可读的HTML文件。咱们一步步来：

1. 核心思路 #

多部分邮件的结构里，通常包含两类关键节点：

• 一个text/html类型的节点（承载邮件的HTML正文内容）
• 若干inline类型的内嵌图片节点（带有content-id标识，HTML里通过cid:xxx的格式引用这些图片）

我们需要先提取HTML正文，再把HTML里的cid引用替换为图片的base64 Data URI，这样就能直接在浏览器里显示完整的带图HTML了。

2. 具体代码实现 #

下面是完整的解析流程代码，你可以直接整合到你的逻辑里：

import parser from 'emailjs-mime-parser';

// 封装多部分邮件解析函数
const parseMultipartEmail = (messageBody) => {
  const myMimeNodes = parser(messageBody);
  let htmlContent = '';

  // 第一步：提取HTML内容（无HTML则用纯文本转HTML降级处理）
  const htmlNode = myMimeNodes.childNodes.find(node => node.contentType === 'text/html');
  if (htmlNode) {
    // 解码HTML内容
    htmlContent = new TextDecoder('utf-8').decode(htmlNode.content);
  } else {
    // 尝试提取纯文本并转为简单HTML格式
    const textNode = myMimeNodes.childNodes.find(node => node.contentType === 'text/plain');
    if (textNode) {
      const textContent = new TextDecoder('utf-8').decode(textNode.content);
      htmlContent = textContent.replace(/\n\n/g, '</p><p>').replace(/\n/g, '<br>');
      htmlContent = `<p>${htmlContent}</p>`;
    } else {
      htmlContent = '<p>邮件无可用内容</p>';
    }
  }

  // 第二步：处理内嵌图片，替换cid引用为Data URI
  const inlineImages = myMimeNodes.childNodes.filter(node => 
    node.contentDisposition === 'inline' && node.contentId
  );

  inlineImages.forEach(imgNode => {
    // 去掉contentId自带的尖括号（比如<abc123@example.com> → abc123@example.com）
    const contentId = imgNode.contentId.replace(/[<>]/g, '');
    const mimeType = imgNode.contentType;
    // 将Uint8Array格式的图片内容转为base64编码
    const base64Content = btoa(String.fromCharCode(...new Uint8Array(imgNode.content)));
    const dataUri = `data:${mimeType};base64,${base64Content}`;
    
    // 全局替换HTML里的cid引用
    htmlContent = htmlContent.replace(new RegExp(`cid:${contentId}`, 'g'), dataUri);
  });

  return htmlContent;
};

// 调用示例：结合你的IMAP获取逻辑
imapClient.listMessages('INBOX', '1:25', ['uid', 'flags', 'body.peek[]']).then(messages => {
  // 解析第一封多部分邮件
  const readableHtml = parseMultipartEmail(messages[0]['body[]']);
  // 现在你可以把readableHtml插入到页面DOM，或者保存为.html文件直接打开
  console.log(readableHtml);
});

3. 关键细节说明 #

• contentId处理：邮件里的content-id默认会带尖括号，需要先去除再匹配HTML里的cid:引用，否则替换会失效。
• Base64编码转换：emailjs-mime-parser返回的内容是Uint8Array类型，必须先转成字符串再用btoa编码成base64，才能生成可直接使用的Data URI。
• 降级兼容：如果邮件没有HTML内容，自动将纯文本转为简单HTML格式，保证内容的可读性。

这样处理后，你得到的readableHtml就是可以直接在浏览器打开的完整HTML内容，内嵌图片也能正常显示啦！

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