Send a base64 image in HTML email

EmailBase64Html EmailData Uri

Email Problem Overview


Using a rich-text editor, our users can drag and drop a saved image from their desktop to the editor. The image appears and displays properly in the web page after they submit.

Since the image is not uploaded anywhere, the editor saves the image as a base64-encoded image.

<img alt="" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA4QAAAFKCAIAAADKUQaBAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAP+lSURBVHhepP1p32zb

etc.

But it doesn't show up - not on the iPhone, nor two different versions of Outlook. The image is simply broken. We want to stick with base64 due to it already working with the web page and the ability to view an image if the user is offline.

Email Solutions


Solution 1 - Email

Support, unfortunately, is brutal at best. Here's a post on the topic:

https://www.campaignmonitor.com/blog/email-marketing/2013/02/embedded-images-in-html-email/

And the post content: enter image description here

Solution 2 - Email

An alternative approach may be to embed images in the email using the cid method. (Basically including the image as an attachment, and then embedding it). In my experience, this approach seems to be well supported these days.

enter image description here

Here's a little more reading: https://sendgrid.com/blog/embedding-images-emails-facts/

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionVael VictusView Question on Stackoverflow
Solution 1 - EmailChordsView Answer on Stackoverflow
Solution 2 - EmailAaronView Answer on Stackoverflow