Enviar una imagen base64 en un correo electrónico HTML

Con un editor de texto enriquecido, nuestros usuarios pueden arrastrar y soltar una imagen guardada desde su escritorio al editor. La imagen aparece y se muestra correctamente en la página web después de enviarla.

Dado que la imagen no se carga en ningún lugar, el editor guarda la imagen como una imagen codificada en base64.

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

etc.

Pero no aparece, ni en el iPhone ni en dos versiones diferentes de Outlook. La imagen simplemente está rota. Queremos seguir con base64 debido a que ya funciona con la página web y la capacidad de ver una imagen si el usuario está desconectado.

— Vael Victus
fuente

Posible duplicado de ¿Cómo incrustar correctamente imágenes en HTML para mostrarlas en clientes de correo web?

— Amit G

Respuestas:

124

El apoyo, desafortunadamente, es brutal en el mejor de los casos. Aquí hay una publicación sobre el tema:

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

Y el contenido de la publicación: ingrese la descripción de la imagen aquí

— Acordes
fuente

Marcado como respuesta porque simplemente es la respuesta: el soporte apesta para base64 y debe intentar evitarlo cuando pueda. Logramos que funcionaran, en realidad hubo un error en el caso de esta pregunta. Sin embargo, tuvimos que exigir que se utilizara Outlook 2007. Apple funciona bien con imágenes base64.

— Vael Victus

¿Compatible con Outlook 2003, pero no compatible con Outlook 2007? Que estan pensando

— cytsunny

cual es la alternativa

Gracias por esto, estaba a punto de escribir una publicación SO con mi propia muestra de base64. Supuse que al revisar mi correo electrónico resultante en dos navegadores (GMail y Outlook), y al verificar que mi texto base64 no estaba dañado, debería estar funcionando bien ..

— Memetican

@AkhilJain esto funcionó para mí stackoverflow.com/a/36870709/5536005

— radbrawler

Un enfoque alternativo puede ser incrustar imágenes en el correo electrónico utilizando el cidmétodo. (Básicamente, incluir la imagen como un archivo adjunto y luego incrustarla). En mi experiencia, este enfoque parece estar bien respaldado en estos días.

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

— Aaron
fuente

de hecho funciona, pero lamentablemente algunos servicios de correo electrónico le cobrarán por enviar archivos adjuntos.

— Sombriks

Además, muchos clientes, incluida la interfaz web de Gmail, agregarán una copia de todas las imágenes adjuntas al final del mensaje, lo cual es muy, muy feo.

— Daniel Saner