[email] Send a base64 image in HTML email

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.

This question is related to email base64 html-email data-uri

The answer is


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


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

Source: https://www.campaignmonitor.com/blog/how-to/2008/08/embedding-images-revisited/


Examples related to email

Monitoring the Full Disclosure mailinglist require(vendor/autoload.php): failed to open stream Failed to authenticate on SMTP server error using gmail Expected response code 220 but got code "", with message "" in Laravel How to to send mail using gmail in Laravel? Laravel Mail::send() sending to multiple to or bcc addresses Getting "The remote certificate is invalid according to the validation procedure" when SMTP server has a valid certificate How to validate an e-mail address in swift? PHP mail function doesn't complete sending of e-mail How to validate email id in angularJs using ng-pattern

Examples related to base64

How to convert an Image to base64 string in java? How to convert file to base64 in JavaScript? How to convert Base64 String to javascript file object like as from file input form? How can I encode a string to Base64 in Swift? ReadFile in Base64 Nodejs Base64: java.lang.IllegalArgumentException: Illegal character Converting file into Base64String and back again Convert base64 string to image How to encode text to base64 in python Convert base64 string to ArrayBuffer

Examples related to html-email

html tables & inline styles CSS to make table 100% of max-width Send a base64 image in HTML email How do I send email with JavaScript without opening the mail client? Color a table row with style="color:#fff" for displaying in an email Has anyone gotten HTML emails working with Twitter Bootstrap? Styling HTML email for Gmail How do I remove link underlining in my HTML email? Remove spacing between table cells and rows HTML5 Email input pattern attribute

Examples related to data-uri

Send a base64 image in HTML email Drawing an image from a data URL to a canvas Download data url file Is embedding background image data into CSS as Base64 good or bad practice? Is there any way to specify a suggested filename when using data: URI?