通过 html 添加到电子邮件时，如何防止引用的 PNG 被压缩？答案

【问题标题】：How can I prevent a referenced PNG from being squashed when added to an email via html?通过 html 添加到电子邮件时，如何防止引用的 PNG 被压缩？
【发布时间】：2016-12-26 00:30:36
【问题描述】：

我有这个代码可以发送一封引用互联网上图片的电子邮件：

private void EmailSheet(PricePushFile ppf)
{
    string emailAddr = GetEmailAddressForUnit(ppf.SourceFileName);
    Microsoft.Office.Interop.Outlook.Application app = new Microsoft.Office.Interop.Outlook.Application();
    MailItem mailItem = app.CreateItem(OlItemType.olMailItem);
    mailItem.To = emailAddr;
    string customer = GetCustomerName(ppf.SourceFileName);
    mailItem.Subject = string.Format("PRO*ACT Price Push – {0}", customer);

    List<String> htmlBody = new List<string>
        {
            "<html><body><img src=\"http://www.proactusa.com/wp-content/themes/proact/images/pa_logo_notag.png\" alt=\"Pro*Act logo\" ><p>Your PRO*ACT Price Push report is attached.</p>",
            "</body></html>"
        };
    mailItem.HTMLBody = string.Join(Environment.NewLine, htmlBody.ToArray());

    mailItem.Attachments.Add(ppf.SourceFileName);
    mailItem.Importance = OlImportance.olImportanceNormal;
    mailItem.Display(false);
    mailItem.Send(); // This sends the email without a dialog displaying first
}

引用的 png (http://www.proactusa.com/wp-content/themes/proact/images/pa_logo_notag.png) 相当大，但是在发送电子邮件时，它被压扁得可怜：

如何确保图像在电子邮件中显示为全尺寸而不是压缩？

更新

添加显式大小可以正常工作，但首选的“Base64”路由不起作用；我试过这个：

private static String PROACT_LOGO_BINARY = 
    "iVBORw0KGgoAAAAN. . .2ytlR8BYrxuzvr/AM6ZTOQUGb1+AAAAAElFTkSuQmCC";

. . .

string proactLogoAsBinary = PROACT_LOGO_BINARY;
List<String> htmlBody = new List<string>
{
    String.Format("<html><body><img src=\"data:image/png;base64,{0}\" alt=\"Pro*Act logo\" ><p>Your PRO*ACT reports are attached.</p></body></html>", proactLogoAsBinary)
};
mailItem.HTMLBody = string.Join(Environment.NewLine, htmlBody.ToArray());

...我得到一个“损坏的图像”替换图像（小红色前）

注意：我通过this 获得了二进制文件：

【问题讨论】：

您是否有机会获得渲染的消息并将其放入 pastebin 或类似文件中？我看不出有什么明显的错误，我很想看看它是如何被 Web 浏览器和其他 MUA 呈现的。我没有听说这种技术在任何地方都失败了，但 Outlook 在 MUA 方面一直有点离群...
没有消息；它只是显示“我无法从你试图拍打在那里的图像中做出正面或反面”图标，而不是非常漂亮的图像。
对不起，我有点不清楚。如果您的 MUA 具有“查看源代码”选项，请使用它来获取由您的代码呈现的底层消息并粘贴该消息。它将有标题和所有爵士乐。或者，如果您对 bj .at 感到满意，就给我发一条测试信息。 wjblack .dot。 com，我会看看雷鸟用它做什么。
谢谢，但我在 Outlook 中看不到“查看源代码”选项（我认为这是我的“MUA”）。当我尝试将其发送给您时，我收到“无法发送此项目”
引用 superuser.com/questions/476940/…：在消息功能区上，选择操作 |其他动作 |查看源代码我猜您的代码正在呈现的 HTML 中的某些内容很不稳定。样本将极大地帮助诊断。

标签： outlook size png image-resizing mailitem

【解决方案1】：

它可能会因 MUA 而异（我认为您正在查看 Outlook；您知道还有其他电子邮件客户端，对吧？;-)）。

无论如何，我会考虑几件事：

鉴于高度/宽度数据的真空，HTML 渲染器可以决定只渲染一些默认大小。尝试为您的 IMG 标签添加实际高度和宽度：

<img src="..." height="130" width="199"...>
这只是一个徽标（和一个小文件），因此您可能应该考虑将其嵌入到您的消息中（现代 MUA 确实不喜欢默认自动检索远程资源并给用户一个“做你想从 foo.com 下载东西”——类型的消息——所以你的许多用户要么不得不将你列入白名单，要么根本看不到你的徽标）。在这里查看答案：Embed Base64 PNG

由于您可以将文件一次性编码为 base64 并将其复制粘贴到您的 HTML 源代码中，因此不会太痛苦（而且接收者会比外部链接更多地查看它）。

【讨论】：

请看我的更新。

【解决方案2】：

您需要明确设置图像尺寸，以便电子邮件客户端知道您希望图像显示多大。

在你的情况下，图像是 199 x 130，所以添加 width=199, height=130

http://www.proactusa.com/wp-content/themes/proact/images/pa_logo_notag.png\" alt=\"Pro*Act 标志\" width=\"199\" height=\"130 \" >

【讨论】：