Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Sending mail from HTML page with image in the body

I have to bring up the outlook compose box when a button is pressed and the body should contain the image of a specific DIV. I am using html2canvas to capture the image, with mailto i am able to fire a outlook compose mail instance but seems mailto is for simple plain text and is not supporting to embed image in the mailbox.

Any ideas, thoughts?

like image 462
Muthu Avatar asked Oct 15 '14 02:10

Muthu


People also ask

How do you put an image in the body of an email in HTML?

To attach an image, you need to have the encoding scheme of the image you want to attach. This is the base64 string of the picture. You can get this by right-clicking on the image you want to attach, copy the image address, and paste it into the HTML text. The recipient will have a preview of when they open the email.

How do I put a picture in the body of an email?

To insert a picture that displays in the body of an email message, use the following steps: Position your cursor where you want the image in your message. Select Insert > Pictures. Browse your computer or online file locations for the picture you want to insert.

How do I put an image into the body in HTML?

How to Insert an Image in HTML. To insert an image in HTML, use the image tag and include a source and alt attribute. Like any other HTML element, you'll add images to the body section of your HTML file. The HTML image element is an “empty element,” meaning it does not have a closing tag.

Can you have images in the body of an email if it is in plain text mode?

This format works for all email programs, but it doesn't support bold or italic text, colored fonts, or other text formatting. The plain text format also doesn't support showing pictures inside the message, although you can include pictures as attachments.


1 Answers

TL;DR: You cannot do this.


You can use Data URI Scheme to embed an image in HTML. If an emails MIME type is text/html you can do the same. You will have to encode your image with a suitable encoding (e.g.: base64).

For example:

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUA
AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO
9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red dot" />

However, you cannot include HTML in the body part of the mailto: URL. The content of the body parameter is considered plain-text as per RFC 2368.

The special hname "body" indicates that the associated hvalue is the body of the message. The "body" hname should contain the content for the first text/plain body part of the message. The mailto URL is primarily intended for generation of short text messages that are actually the content of automatic processing (such as "subscribe" messages for mailing lists), not general MIME bodies.

So if you use a URL encoded HTML as the body parameter of a mailto: URL, here is what happens:

<a href="mailto:[email protected]?subject=Check%20this%20out!&body=%3Cp%3EHi%3C%2Fp%3E%3Cimg%20src%3D%22data%3Aimage%2Fpng%3Bbase64%2CiVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4%2F%2F8%2Fw38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg%3D%3D%22%20alt%3D%22Red%20dot%22%20%2F%3E">Write Email!</a>

Result:

New Outlook mail message

like image 72
sampathsris Avatar answered Oct 05 '22 23:10

sampathsris