Sending HTML Mail with Embedded Image in .NET
page 8 of 10
by Soyuj Kumar Sahoo
Feedback
Average Rating: 
Views (Total / Last 10 Days): 27993/ 906

An Html mail with embedded image

Embedding images is something that is new with System.Net.Mail in .NET Framework 2.0. To embed an image we will need to:

·         Create an AlternateView object for the Image. The AlternateView will actually contain the binary data of the Image. This binary data is encoded as part of the email and sent along as part of the MailMessage.

·         Set the ContentId property of AlternateView Class to a unique value.

·         Create a HTML AlternateView.

·         Inside that HTML text, we need to use the standard <img> tag.

·         For the "src" value, we need to point it at the Content-Id of the AlternateView image. This is done by using the syntax <img src="cid:ContentId value">. The "src=cid:" part is required for the email client to recognize the <img> tag as an embedded image, while the "ContentId value" part is the actual Content-Id of the AlternateView image. 

That is all there is to create an embedded image view. Below is a short but complete example that demonstrates creating an embedded image message.

Listing 9 – Sample of an Html mail with embedded image

Public Sub EmbeddedImages()
 
        'create the mail message
        Dim mail As New MailMessage()
 
        'set the addresses
        mail.From = New MailAddress("from@fromdomain.com", " Display Name")
        mail.To.Add("to@todomain.com")
       
        'set the content
        mail.Subject = "This is an embedded image mail"
 
        'first we create the Plain Text part
        Dim palinBody As String = "This is my plain text content, viewable by
        those clients that don't support html"
        Dim plainView As AlternateView =
        AlternateView.CreateAlternateViewFromString(palinBody, Nothing,
        "text/plain")
        'then we create the Html part
        'to embed images, we need to use the prefix 'cid' in the img src value
        Dim htmlBody As String = "<b>This is the embedded image 
        file.</b><DIV>&nbsp;</DIV>"
        htmlBody += "<img alt="""" hspace=0 src=""cid:uniqueId"" align=baseline 
        border=0 >"
        htmlBody += "<DIV>&nbsp;</DIV><b>This is the end of Mail...</b>"
        Dim htmlView As AlternateView =
         AlternateView.CreateAlternateViewFromString(htmlBody, Nothing,
         "text/html")
 
        'create the AlternateView for embedded image
        Dim imageView As New AlternateView("c:\attachment\image1.jpg",
        MediaTypeNames.Image.Jpeg)
        imageView.ContentId = "uniqueId"
        imageView.TransferEncoding = TransferEncoding.Base64
 
        'add the views
        mail.AlternateViews.Add(plainView)
        mail.AlternateViews.Add(htmlView)
        mail.AlternateViews.Add(imageView)
 
        'send mail
        SendMail(mail)
 
End Sub ' End EmbedImages

"ImageView" is the instance of AlternateView created using the constructor which takes two parameters as: fileName (with path of image) as String, and mediaType as String. Here we use the public string type constant "Jpeg" of MediaTypeNames.Image Class, which is actually “image/jpeg."

Again, the "TransferEncoding" property of "imageView" (AlternateView Class) is set to "Base64."


View Entire Article

Article Feedback

Title:  
Name:  
Url: ( Optional )
Comment:  
Please add 7 and 1 and type the answer here:

User Comments

Title: need help -urgent   
Name: sunil
Date: 8/20/2008 12:25:16 AM
Comment:
i tried ur code its working good
but the problem is when ever i am sending mail
the word "spam" is getting added to the subject
like if i send test it is like spam test in the subject line when i receive the mail

please help me out

thanks
Title: great job   
Name: bunny
Date: 8/18/2008 10:16:20 PM
Comment:
great work thanq very much for the post
i was working with web.mail some i got some issue with that
and ur code its really wow
thaks once again
Title: Gr8 buddy   
Name: Ankit Maini
Date: 6/27/2008 6:35:42 AM
Comment:
Thanx buddy nice article for me.
Title: asdasd   
Name: fasd
Date: 5/19/2008 9:20:06 PM
Comment:
asdf
Title: Mr   
Name: Baklouti
Date: 5/12/2008 10:44:50 AM
Comment:
Merci pour cet exposé bien fait; je l'ai testé et ça marche; j'ai remarqué sur mon test deux petits points :
1- le message sur yahoo était bien reçu image et texte, mais sur outlook express implémenté sur xp, l'image est bien arrivée et les caractères accentués sont mal interprétés
2- le message reçu sur outlook implémenté sur vista, est classé comme courrier indésirable et l'image n'est pas parvenu
auriez vous quelques idées pour corriger la situation
Merci
Title: For Local Host   
Name: Prince Mathew
Date: 2/19/2008 11:23:33 PM
Comment:
Thanks a lot... it saved much time...
Found some settings is needed to send thru localhost as server. Link provided will help

http://codebetter.com/blogs/peter.van.ooijen/archive/2006/04/05/Using-localhost-as-mailserver-_2800_5.7.1-Unable-to-relay-for-xxx_2900_.aspx
Title: View message before sending   
Name: Jerre
Date: 1/30/2008 9:23:19 AM
Comment:
I there a way to view the message in outlook 2003 first before sending it?
Title: Thank You Very Much...   
Name: Slawek
Date: 12/15/2007 7:05:52 PM
Comment:
Your article helped me very, very much and saved me much time. I think, you could add an examle how to authenticate on smtp server using login/password (single line at the end of this comment), and article will be truly complete
Slawek

smtp.Credentials = new System.Net.NetworkCredential(login,password)
Title: Imran   
Name: Imran Ali
Date: 11/6/2007 10:56:14 AM
Comment:
Hello ... Thank you ,,, It is very helpful
Title: ThankxxX   
Name: Mohammed. Akhtar
Date: 8/29/2007 6:18:45 AM
Comment:
It was very useful.
Title: Thanx To You   
Name: Sai
Date: 8/10/2007 1:28:03 AM
Comment:
Hello Sir,

I got good idea from this article but i expecting to know how can i read mails came to me in my gmail account in my asp.net application using POP3 Access.
Title: Pankaj   
Name: Pankaj Baviskar
Date: 8/7/2007 9:18:21 AM
Comment:
\
\
Title: Very good work   
Name: Jose
Date: 8/7/2007 2:36:54 AM
Comment:
Thank you Soyuj for this very good work. Each step is very well explained. Good job!
Title: Thanks!   
Name: Oscar
Date: 8/6/2007 11:53:30 AM
Comment:
Thanks a lot Soyuj! i'll try it that way
Title: Hotmail issue..   
Name: Soyuj Kumar
Date: 8/6/2007 3:41:14 AM
Comment:
Hello Oscar,

I have already checked with LinkedResource class and it is working fine for Hotmail.... try this..

Thanks.

Soyuj
Title: I am trying   
Name: Soyuj Kumar
Date: 8/6/2007 3:20:24 AM
Comment:
Hi...

Thanks for this nice questions!!! I have tried with Yahoo, Gmail, Hotmail... but got failed in Hotmail to see the image.. Yahoo and Gmail supports...

Please check the message source in all the experimental cases.. hello Kevin check the Outlook's source if the image source is there then we need to do some R&D..

BTW, another possible way is to try this action using "LinkedResource" which will take the path of the image.. and then (AlternateView)htmlView.add(LinkedResource) ....

So, please try with this...

Thanks,
Soyuj
Title: Thank You!   
Name: amin behzadi
Date: 8/4/2007 3:57:15 AM
Comment:
Excelent...! Very nice and clear to understandig.
thank you!
Title: Question   
Name: Oscar
Date: 8/3/2007 11:20:02 AM
Comment:
Excelent code Soyuj!! i have a question..the example works fine if i see the mail message in gmail(i see the text and the image), but in msnHotmail(i see the text and a gray box instead of the image) in mozilla i only see the image..
What could be the problem? is there any special setup that we need to see this mail correclty??
Thanks a lot!!!
Title: Thank, another question ask   
Name: Kevin
Date: 8/3/2007 2:43:25 AM
Comment:
your code got worked in outlook express, failed in outlook.

in outlook, i just saw a red cross instead of the pic. Do you know why or have you tested it like that?

any ideas please feel free to contact me via kevins@verdant.com.au. thanks again.

Cheers,
Kevin
Title: Thanks   
Name: Soyuj Kumar
Date: 8/2/2007 8:54:49 AM
Comment:
Thanks !!! for these nice comments...
Title: Enjoyed your article   
Name: Patricia
Date: 8/1/2007 10:33:58 PM
Comment:
Your writing style makes it so clear to understand. Thank you and looking forward to more of your articles.
Title: Nice work   
Name: John
Date: 7/27/2007 3:29:23 AM
Comment:
Nice work man.. Keep it up !!!

Product Spotlight
Product Spotlight 
Learn More
.NET Tools
asp.net shopping cart
asp.net chart control






Ads Powered by Lake Quincy Media
Community Advice: ASP | SQL | XML | Regular Expressions | Windows


©Copyright 1998-2008 ASPAlliance.com  |  Page Processed at 9/6/2008 8:12:35 PM  AspAlliance Recent Articles RSS Feed
About ASPAlliance | Newsgroups | Advertise | Authors | Email Lists | Feedback | Link To Us | Privacy | Search