Send Email with Embedded Images in C# from Windows Store Apps - XAML - UWP

In previous section, I introduced how to send email with file attachment. In this section, I will introduce how to add embedded images to email in C#.

Introduction

To attach an embedded images to email, you should add an attachment to email at first. Then you should assign an unique identifier(contentid) to this attachment. Finally, you need to replace the <img src="your file name" /> to <img src="cid:yourcontentid" />.

Note

Remarks: All of samples in this section are based on first section: Send email in A simple C# XAML Windows Store App project. To compile and run the following example codes successfully, please click here to learn how to create the test project and add reference of EASendMail to your project.

[C# - Add embedded images to email]

The following example codes demonstrate how to use EASendMail SMTP component to send email with embedded images.

Note

To get the full sample projects, please refer to Samples section.

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;

// Add EASendMail and Tasks Namespace
using System.Threading.Tasks;
using EASendMail;

namespace CSharp_Windows_Store_App
{
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
        }

        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
        }

        private async void btnSend_Click(object sender, RoutedEventArgs e)
        {
            btnSend.IsEnabled = false;
            await Send_Email();
            btnSend.IsEnabled = true;
        }

        private async Task Send_Email()
        {
            String Result = "";
            try
            {
                SmtpMail oMail = new SmtpMail("TryIt");
                SmtpClient oSmtp = new SmtpClient();

                // Set sender email address, please change it to yours
                oMail.From = new MailAddress("test@emailarchitect.net");

                // Add recipient email address, please change it to yours
                oMail.To.Add(new MailAddress("support@emailarchitect.net"));

                // Set email subject
                oMail.Subject = "test email from C# XAML project with embedded image";

                // Your SMTP server address
                SmtpServer oServer = new SmtpServer("smtp.emailarchitect.net");

                // User and password for ESMTP authentication
                oServer.User = "test@emailarchitect.net";
                oServer.Password = "testpassword";

                // If your SMTP server requires TLS connection on 25 port, please add this line
                // oServer.ConnectType = SmtpConnectType.ConnectSSLAuto;

                // If your SMTP server requires SSL connection on 465 port, please add this line
                // oServer.Port = 465;
                // oServer.ConnectType = SmtpConnectType.ConnectSSLAuto;

                // get a file path from PicturesLibrary,
                // to access files in PicturesLibrary, you MUST have "Pictures Library" checked in
                // your project -> Package.appxmanifest -> Capabilities
                Windows.Storage.StorageFile file =
                    await Windows.Storage.KnownFolders.PicturesLibrary.GetFileAsync("test.jpg");

                string attfile = file.Path;
                Attachment oAttachment = await oMail.AddAttachmentAsync(attfile);

                // if you want to add attachment from remote URL instead of local file.
                // string attfile = "http://www.emailarchitect.net/test.jpg";
                // Attachment oAttachment = await oMail.AddAttachmentAsync(attfile);

                // you can change the Attachment name by
                // oAttachment.Name = "mytest.jpg";

                // Specifies the attachment as an embedded image
                string contentID = "test001@host";
                oAttachment.ContentID = contentID;
                oMail.HtmlBody = "<html><body>this is an <img src=\"cid:"
                        + contentID + "\"> embedded picture.</body></html>";

                await oSmtp.SendMailAsync(oServer, oMail);
                Result = "Email was sent successfully!";
            }
            catch (Exception ep)
            {
                Result = String.Format("Failed to send email with the following error: {0}", ep.Message);
            }

            // Display Result by Diaglog box
            Windows.UI.Popups.MessageDialog dlg = new
                Windows.UI.Popups.MessageDialog(Result);

            await dlg.ShowAsync();
        }
    }
}

To attach embedded images/pictures, SmtpMail.ImportHtmlBodyAsync and SmtpMail.ImportHtmlAsync methods are strongly recommended. With these methods, you don’t have to specify the ContentID manually. The html source/file html body can be imported to email with embedded pictures automatically.

HTML editor with embedded images

You can also refer to the Samples_Windows81/10 in EASendMail Installer. Those samples demonstrate how to build a HTML email editor and send HTML email with attachment or embedded images/pictures.

c# html editor

Next Section

At next section I will introduce how to send email with event handler.

Appendix

Comments

If you have any comments or questions about above example codes, please click here to add your comments.