Встраивание изображения в html-адрес электронной почты

Я пытаюсь отправить многостраничный/связанный html-адрес электронной почты со встроенными изображениями gif. Это электронное письмо создается с использованием Oracle PL/SQL. Мои попытки потерпели неудачу, и изображение появилось в виде красного X (в Outlook 2007 и почте yahoo).

Я отправлял html-письма в течение некоторого времени, но теперь я должен использовать несколько gif-изображений в письме. Я могу хранить их на одном из наших веб-серверов и просто ссылаться на них, но многие пользователи электронной почты клиентов не будут показывать их автоматически и должны будут либо изменять настройки, либо вручную загружать их для каждого письма.

Итак, мои мысли - включить изображение. Мои вопросы:

Что я здесь делаю неправильно?
Правильно ли подходит встраивание?
Любые другие варианты, если мне нужно использовать все больше и больше изображений? Вложения не будут работать, поскольку изображения обычно являются логотипами и значками, которые не будут иметь смысла в контексте сообщения. Кроме того, некоторые элементы электронной почты являются ссылками в онлайн-систему, поэтому создание статического PDF файла и прикрепление не будут работать (насколько мне известно).

сниппет:

MIME-Version: 1.0
To: [email protected]
BCC: [email protected]
From: [email protected]
Subject: Test
Reply-To: [email protected]
Content-Type: multipart/related; boundary="a1b2c3d4e3f2g1"

--a1b2c3d4e3f2g1

content-type: text/html;

    <html>
    <head><title>My title</title></head>
    <body>
    <div style="font-size:11pt;font-family:Calibri;">
    <p><IMG SRC="cid:my_logo" alt="Logo"></p>

... more html here ...

</div></body></html> 

--a1b2c3d4e3f2g1

Content-Type: image/gif;
Content-ID:<my_logo>
Content-Transfer-Encoding: base64
Content-Disposition: inline

[base64 image data here]

--a1b2c3d4e3f2g1--

Большое спасибо.

BTW: Да, я подтвердил, что данные base64 верны, так как я могу встроить изображение в сам html (используя то же самое использование алгоритма для создания данных заголовка) и увидеть изображение в Firefox/IE.

Я также должен отметить, что это НЕ для спама, электронные письма отправляются конкретным клиентам, которые ожидают его ежедневно. Содержимое управляется данными, а не рекламными объявлениями.

Ответы

Ответ 1

Попробуйте вставить его напрямую, таким образом, вы можете вставить несколько изображений в разных местах электронной почты.

<img src="data:image/jpg;base64,{{base64-data-string here}}" />

И сделать эту публикацию полезной для других, чтобы: если у вас нет строки base64-данных, легко создайте ее по адресу: http://www.motobit.com/util/base64-decoder-encoder.asp из файла изображения,

Исходный код электронной почты выглядит примерно так, но я действительно не могу сказать вам, для чего эта граница:

 To: [email protected]
 Subject: ...
 Content-Type: multipart/related;
 boundary="------------090303020209010600070908"

This is a multi-part message in MIME format.
--------------090303020209010600070908
Content-Type: text/html; charset=ISO-8859-15
Content-Transfer-Encoding: 7bit

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>

    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-15">
  </head>
  <body bgcolor="#ffffff" text="#000000">
    <img src="cid:part1.06090408.01060107" alt="">
  </body>
</html>

--------------090303020209010600070908
Content-Type: image/png;
 name="moz-screenshot.png"
Content-Transfer-Encoding: base64
Content-ID: <part1.06090408.01060107>
Content-Disposition: inline;
 filename="moz-screenshot.png"

[base64 image data here]

--------------090303020209010600070908--

//РЕДАКТИРОВАТЬ: О, я просто понимаю, что если вы вставите первый фрагмент кода из моего поста, чтобы написать электронное письмо с помощью thunderbird, thunderbird автоматически изменит код HTML, чтобы он выглядел почти так же, как второй код в моем сообщении.

Ответ 2

Другое решение - прикрепить изображение как вложение, а затем сослаться на его HTML-код с помощью cid.

HTML-код:

<html>
    <head>
    </head>
    <body>
        <img width=100 height=100 id="1" src="cid:Logo.jpg">
    </body>
</html>

Код С#:

EmailMessage email = new EmailMessage(service);
email.Subject = "Email with Image";
email.Body = new MessageBody(BodyType.HTML, html);
email.ToRecipients.Add("[email protected]");
string file = @"C:\Users\acv\Pictures\Logo.jpg";
email.Attachments.AddFileAttachment("Logo.jpg", file);
email.Attachments[0].IsInline = true;
email.Attachments[0].ContentId = "Logo.jpg";
email.SendAndSaveCopy();

Ответ 3

Я не нахожу здесь ничего полезного, поэтому я предоставляю свое решение.

Проблема заключается в том, что вы используете multipart/related как тип контента, который в этом случае не очень хорош. Я использую multipart/mixed и внутри него multipart/alternative (он работает на большинстве клиентов).

Структура сообщения должна быть следующей:

[Headers]
Content-type:multipart/mixed; boundary="boundary1"
--boundary1
Content-type:multipart/alternative; boundary="boundary2"
--boundary2
Content-Type: text/html; charset=ISO-8859-15
Content-Transfer-Encoding: 7bit
[HTML code with a href="cid:..."]

--boundary2
Content-Type: image/png;
name="moz-screenshot.png"
Content-Transfer-Encoding: base64
Content-ID: <part1.06090408.01060107>
Content-Disposition: inline; filename="moz-screenshot.png"
[base64 image data here]

--boundary2--
--boundary1--

Тогда он будет работать

Ответ 4

Если это не сработает, вы можете попробовать один из этих инструментов, который преобразует изображение в таблицу HTML (будьте осторожны с размером вашего изображения):

Ответ 5

Использование Base64 для встраивания изображений в html является удивительным. Тем не менее, обратите внимание, что строки base64 могут сделать ваш размер электронной почты большим.

Следовательно,

1) Если у вас много изображений, загрузка изображений на сервер и загрузка этих изображений с сервера могут уменьшить ваш размер электронной почты. (Вы можете получить много бесплатных услуг через Google)

2) Если в вашей почте всего несколько изображений, использование строк base64 определенно является прекрасным вариантом.

Помимо выбора, предоставленного существующими ответами, вы также можете использовать команду для генерации строки base64 в linux:

base64 test.jpg

Ответ 6

Я знаю, что это старый пост, но текущие ответы не учитывают тот факт, что Outlook и многие другие поставщики электронной почты не поддерживают встроенные изображения или изображения CID. Самый эффективный способ разместить изображения в письмах - разместить их в Интернете и разместить ссылку на них в письме. Для небольших списков адресов электронной почты общедоступный дропбокс работает нормально. Это также уменьшает размер электронной почты.

Ответ 7

Вам необходимо 3 границы для встроенных изображений, которые будут полностью совместимы.
Все происходит внутри multipart/mixed.
Затем используйте multipart/related, чтобы содержать ваши multipart/alternative и заголовки вложений изображения.
Наконец, включите свои загружаемые вложения внутри последней границы multipart/mixed.

Ответ 8

Для тех, кто не может заставить работать одно из этих решений: Отправить встроенное изображение по электронной почте. Следуя инструкциям, изложенным в решении, предлагаемом @T30, я смог отобразить свое встроенное изображение без блокировки внешним видом (предыдущие методы были заблокированы), Если вы используете обмен, как мы, то также при выполнении:

service = new ExchangeService(ExchangeVersion);
service.AutodiscoverUrl("[email protected]");
SmtpClient smtp = new SmtpClient(service.Url.Host);

вам нужно будет передать его вашему хосту. Кроме того, следуя этому решению, вы должны легко отправлять встроенные изображения.

Ответ 9

Может показаться, что Outlook и Outlook Express могут создавать эти многостраничные форматы электронной почты, если вы вставляете файлы изображений с помощью функции меню "Вставка/изображение".

Очевидно, что тип электронной почты должен быть установлен в HTML (не обычный текст).

Любой другой метод (например, перетаскивание/перетаскивание или любой вызов из командной строки) приводит к тому, что изображения (изображения) отправляются как вложение.

Если вы отправляете такое электронное письмо себе, вы можете увидеть, как он отформатирован!:)

FWIW, я ищу автономный исполняемый файл Windows, который делает встроенные изображения из режима командной строки, но, похоже, их нет. Это путь, который многие подняли... Можно сделать это с помощью Outlook Express, передав его соответствующим образом отформатированным файлом .eml.

Ответ 10

На самом деле очень хорошее сообщение в блоге, в котором перечислены про и минусы трех разных подходов к этой проблеме Мартина Дэвиса. Вы можете прочитать его на https://sendgrid.com/blog/embedding-images-emails-facts/.

Я хотел бы добавить четвертый подход с использованием фоновых изображений CSS.

Добавить

<div id="myImage"></div>

для вашего тела электронной почты и класса css, например:

#myImage {
    background-image:  url('data:image/png;base64,iVBOR...[some more encoding]...rkggg==');
    width: [the-actual-image-width];
    height: [the-actual-image-height];
}

Ответ 11

Для начинающих чтение этой статьи помогло мне понять различные типы методов встраивания img для электронной почты.

Прочитайте статью: "Полезная статья, описывающая три различных метода встраивания изображений в электронные письма".

Ответ 12

Ниже приведен рабочий код с двумя способами достижения этого:

using System;
using Outlook = Microsoft.Office.Interop.Outlook;

namespace ConsoleApp2
{
    class Program
    {
        static void Main(string[] args)
        {

            Method1();
            Method2();
        }

        public static void Method1()
        {
            Outlook.Application outlookApp = new Outlook.Application();
            Outlook.MailItem mailItem = outlookApp.CreateItem(Outlook.OlItemType.olMailItem);
            mailItem.Subject = "This is the subject";
            mailItem.To = "[email protected]";
            string imageSrc = "D:\\Temp\\test.jpg"; // Change path as needed

            var attachments = mailItem.Attachments;
            var attachment = attachments.Add(imageSrc);
            attachment.PropertyAccessor.SetProperty("http://schemas.microsoft.com/mapi/proptag/0x370E001F", "image/jpeg");
            attachment.PropertyAccessor.SetProperty("http://schemas.microsoft.com/mapi/proptag/0x3712001F", "myident"); // Image identifier found in the HTML code right after cid. Can be anything.
            mailItem.PropertyAccessor.SetProperty("http://schemas.microsoft.com/mapi/id/{00062008-0000-0000-C000-000000000046}/8514000B", true);

            // Set body format to HTML

            mailItem.BodyFormat = Outlook.OlBodyFormat.olFormatHTML;
            string msgHTMLBody = "<html><head></head><body>Hello,<br><br>This is a working example of embedding an image unsing C#:<br><br><img align=\"baseline\" border=\"1\" hspace=\"0\" src=\"cid:myident\" width=\"\" 600=\"\" hold=\" /> \"></img><br><br>Regards,<br>Tarik Hoshan</body></html>";
            mailItem.HTMLBody = msgHTMLBody;
            mailItem.Send();
        }

        public static void Method2()
        {

            // Create the Outlook application.
            Outlook.Application outlookApp = new Outlook.Application();

            Outlook.MailItem mailItem = (Outlook.MailItem)outlookApp.CreateItem(Outlook.OlItemType.olMailItem);

            //Add an attachment.
            String attachmentDisplayName = "MyAttachment";

            // Attach the file to be embedded
            string imageSrc = "D:\\Temp\\test.jpg"; // Change path as needed

            Outlook.Attachment oAttach = mailItem.Attachments.Add(imageSrc, Outlook.OlAttachmentType.olByValue, null, attachmentDisplayName);

            mailItem.Subject = "Sending an embedded image";

            string imageContentid = "someimage.jpg"; // Content ID can be anything. It is referenced in the HTML body

            oAttach.PropertyAccessor.SetProperty("http://schemas.microsoft.com/mapi/proptag/0x3712001E", imageContentid);

            mailItem.HTMLBody = String.Format(
                "<body>Hello,<br><br>This is an example of an embedded image:<br><br><img src=\"cid:{0}\"><br><br>Regards,<br>Tarik</body>",
                imageContentid);

            // Add recipient
            Outlook.Recipient recipient = mailItem.Recipients.Add("[email protected]");
            recipient.Resolve();

            // Send.
            mailItem.Send();
        }
    }
}

Ответ 13

Если вы используете Outlook для отправки статического изображения с гиперссылкой, простым способом было бы использовать Word.

Открыть MS Word
Скопировать изображение на пустую страницу
Добавить гиперссылку на изображение (Ctrl + K)
Скопировать изображение на адрес электронной почты