Google Scripts从Docs生成邮件丢失格式问题求助

Hey there, sorry to hear your formatting's gone wonky when moving content from Google Docs to Gmail drafts—this is a super common gotcha because Google Docs' HTML output doesn't play perfectly with what Gmail supports. Let's break down why this happens and how to fix it.

Why the Formatting Disappears #

When you pull raw HTML from a Google Doc (using something like DocumentApp.getActiveDocument().getAs('text/html')), it comes packed with extra inline styles, nested container divs, and Google-specific classes that Gmail's renderer strips out. For example, Docs might use <span style="font-weight:700"> for bold, but wraps it in layers of divs that Gmail ignores, or uses non-standard attributes that get discarded.

Solution 1: Clean Up the Doc's HTML for Gmail #

The simplest fix is to process the raw HTML from Docs to remove unnecessary cruft and retain only the formatting Gmail recognizes. Here's a script snippet that does just that:

function getCleanDocHtml() {
  const doc = DocumentApp.getActiveDocument();
  let rawHtml = doc.getAs('text/html').getDataAsString();
  
  // Strip out Google's wrapper divs
  rawHtml = rawHtml.replace(/<div[^>]+>/g, '').replace(/<\/div>/g, '');
  // Replace span-based bold with standard <b> tags (Gmail prefers these)
  rawHtml = rawHtml.replace(/<span style="font-weight:[^"]+">/g, '<b>');
  rawHtml = rawHtml.replace(/<\/span>(?![^<]*<b>)/g, '</b>');
  // Replace span-based italics with standard <i> tags
  rawHtml = rawHtml.replace(/<span style="font-style:italic[^"]*">/g, '<i>');
  rawHtml = rawHtml.replace(/<\/span>(?![^<]*<i>)/g, '</i>');
  
  // Optional: Remove leftover inline styles you don't need
  rawHtml = rawHtml.replace(/style="[^"]+"/g, '');
  
  return rawHtml;
}

When building your Gmail draft, use this cleaned HTML instead of the raw output. This strips out the stuff Gmail doesn't care about and replaces span-based formatting with standard tags that Gmail renders reliably.

Solution 2: Use the Docs API for Structured Content Control #

If you need to preserve more complex elements like links, lists, or headings, using the Google Docs API gives you full control over how you convert content to Gmail-friendly HTML.

First, enable the Docs API in your script project: Go to Resources > Advanced Google Services, then toggle on the Docs API. Then use this code:

function getFormattedContentFromDocsAPI() {
  const docId = DocumentApp.getActiveDocument().getId();
  const response = Docs.Documents.get(docId);
  const content = response.body.content;
  
  let html = '';
  
  content.forEach(element => {
    if (element.paragraph) {
      const paragraph = element.paragraph;
      paragraph.elements.forEach(elem => {
        if (elem.textRun) {
          let text = elem.textRun.content.trim();
          const style = elem.textRun.textStyle;
          
          // Apply bold if enabled
          if (style.bold) text = `<b>${text}</b>`;
          // Apply italics if enabled
          if (style.italic) text = `<i>${text}</i>`;
          // Apply underline if enabled
          if (style.underline) text = `<u>${text}</u>`;
          // Preserve links
          if (style.link) text = `<a href="${style.link.url}">${text}</a>`;
          
          html += text;
        }
      });
      html += '<br><br>'; // Add spacing between paragraphs
    }
  });
  
  return html;
}

This code iterates through each paragraph and text run in your Doc, checks for formatting styles, and builds HTML using tags Gmail understands. You can extend it further to handle lists or headings by adding checks for those elements in the Docs API response.

Testing the Fix #

Always test your generated draft by opening it directly in Gmail—sometimes the preview pane doesn't show formatting correctly, but the actual draft will. Stick to basic formatting (bold, italics, links, plain lists) for the most reliable results, as Gmail has limited support for custom fonts or colored text.

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