How to embed an image in the HTML body of an email in iOS

Question

I'm trying to include an image in the body of an HTML email sent from an iPad. It seems impossible. I have tried to use the CID approach, but it seems that in iOS it is not possible to get/set the CID of attachments.

I've also tried to embed the image with src="data:image/png;base64, blahblahblah". When you compose the mail it seems to work, but nothing appears when the mail is received.

Any ideas?

More Detail: We are not looking for a solution where the JPEG/PNG is attached at the bottom of an email. That's easy to do with [composer addAttachmentData:mimeType:fileName:].

We are looking for a solution where the image is embedded inline in an HTML-formatted email. You could wrap a link around that IMG tag, so that when the recipient clicks the IMG, he/she will be linked out to the app's iTunes page.

I posted a blog on how to do this here: http://blog.tinymission.com/blog/blogengine.web/post/2011/12/29/Inline-Attachments-Using-MFMailComposeViewController.aspx — Hahnemann, Sep 01 '12 at 01:10
do you only want to send an image or also somw thext? May e this post can help http://stackoverflow.com/questions/2534217/display-local-image-in-iphone-html-mail — Daniele B, Dec 05 '12 at 13:36
@Carlos Do you solved your problem? Please tell me how! I want to make that feature too in my app. Thank you! — MasterRazer, Jul 25 '13 at 19:51

score 6 · Accepted Answer · edited Dec 08 '12 at 00:29

6

Download the NSData+base64 category from github.

Then do the following:

NSData *imageData = [NSData dataWithContentsOfFile:pathInDocumentDirectory(imagePath)];
NSString *base64String = [imageData base64EncodedString];
NSString *imageString = [NSString stringWithFormat:@"data:image/png;base64,%@", base64String];

Finally, put the imageString in the HTML body where you want this image to appear.

Hope it helps!

edited Dec 08 '12 at 00:29

Ron

3,055
1
20
21

answered Dec 06 '12 at 10:23

Carlos

1,121
12
26

2

This is very close, but doesn't quite work, because some web clients like GMail do not render img tags with data URIs. :-( I have tested with a tiny red dot PNG as a data URI, and the image showed up fine in the iPad mail client, and in Yahoo mail, but it failed in GMail (even though an inspection of the raw email shows that the base64 string is present). – Ron Dec 09 '12 at 06:13
The best that I could do was have my IMG tag point to a PNG that I host on an external website. But that is not a great solution either, as many web clients will block external images by default. In any case, this base64 solution is pretty close, so I'm happy to award the bounty. :-) – Ron Dec 09 '12 at 06:16
Unfortunately, Gmail web cannot interpret it :/ – Michal Zaborowski Sep 28 '17 at 12:27

score 1 · Answer 2 · edited May 23 '17 at 10:28

From iphone email attachment

MFMailComposeViewController *picker = [[MFMailComposeViewController alloc] init];
picker.mailComposeDelegate = self;

[picker setSubject:@"Hello"];


// Set up recipients
NSArray *toRecipients = [NSArray arrayWithObject:@"first@example.com"]; 
NSArray *ccRecipients = [NSArray arrayWithObjects:@"second@example.com",           @"third@example.com", nil]; 
NSArray *bccRecipients = [NSArray arrayWithObject:@"fourth@example.com"]; 

[picker setToRecipients:toRecipients];
[picker setCcRecipients:ccRecipients];  
[picker setBccRecipients:bccRecipients];

// Attach an image to the email
NSString *path = [[NSBundle mainBundle] pathForResource:@"rainy" ofType:@"png"];
NSData *myData = [NSData dataWithContentsOfFile:path];
[picker addAttachmentData:myData mimeType:@"image/png" fileName:@"rainy"];

// Fill out the email body text
NSString *emailBody = @"It is raining";
[picker setMessageBody:emailBody isHTML:NO];

[self presentModalViewController:picker animated:YES];
[picker release];

score 0 · Answer 3 · answered Dec 29 '15 at 21:50

To show image in gmail, you do:

MFMailComposeViewController *mailCont = [[MFMailComposeViewController alloc] init];
    mailCont.mailComposeDelegate = self; 

    NSMutableString *emailBody = [[NSMutableString alloc] initWithCapacity:20];

    NSString *linkimg = @"https://idrivethru.com/iDriveThruWeb/faces/javax.faces.resource/idrivethru_logo.png?ln=images";

    //Add the image
    [emailBody appendFormat:@"<p><a href = 'https://idrivethru.com/'> <img src='%@' align='centre' alt='iDriveThru.com'> </a></p><br/>", linkimg];

    [emailBody appendString:@"<p>This is an email with an embeded image right <b>above</b> this text</p>"];

    //NSLog(@"%@",emailBody);

    [mailCont setMessageBody:emailBody isHTML:YES];
    [self presentViewController:mailCont animated:YES completion:nil];

How to embed an image in the HTML body of an email in iOS

3 Answers3

Linked