Images codées en base64 dans les signatures de courriel

Question

Images codées en base64 dans les signatures de courriel

Demandé el 2 de Février, 2012: Quand la question a-t-elle été
41635 affichage: Nombre de visites la question a
3 Réponses: Nombre de réponses aux questions
Résolu: Situation réelle de la question

Je dois inclure certaines images (logos d'entreprise, etc.) dans les signatures de courriel. J'ai rencontré toutes sortes de problèmes en utilisant les images intégrées produites par le système de messagerie en question (elles sont généralement envoyées en tant que pièces jointes) et en tant qu'images liées (nécessitant une autorisation pour les afficher dans l'e-mail reçu).

Je viens de voir un courriel d'échange qui contient une représentation d'image en base64 du logo et utilise une balise pour l'afficher. Je cherche des informations sur la façon dont je pourrais faire cela dans une signature de courriel si possible (comment puis-je générer la version base64 du logo pour commencer et de quel code ai-je besoin pour que cela fonctionne) ?

J'ai essayé des choses simples comme

<body>
<span>
<img src=.... >
</span>
</body>

mais tout ce que j'obtiens, c'est le texte alt, donc je fais manifestement quelque chose de mal ici.

Demandé el 2 de Février, 2012 par Peter NUnn

0 votes

Duplicata possible de Comment intégrer des images dans un courriel

Commenté el 2 de Décembre, 2013 par james.garriss

Answer 1

3 Réponses

Answer 2

156voto

Shadow2531 Points 6726

L'image doit être intégrée au message sous forme de pièce jointe, comme ceci :

--boundary
Content-Type: image/png; name="sig.png"
Content-Disposition: inline; filename="sig.png"
Content-Transfer-Encoding: base64
Content-ID: <0123456789>
Content-Location: sig.png

base64 data

--boundary

Et, la partie HTML référencerait l'image comme ceci :

<img src="cid:0123456789">

Chez certains clients, src="sig.png" fonctionne également.

Il s'agit en fait d'un message multipart/mixte, multipart/alternatif, multipart/relatif où l'image jointe se trouve dans la partie relative.

Les clients ne devraient pas non plus bloquer cette image car elle n'est pas distante.

Ou, voici un exemple multipart/alternative, multipart/related sous forme de fichier mbox (enregistrez au format Windows newline et mettez une ligne blanche à la fin. Et, n'utilisez pas d'extension ou l'extension .mbs) :

From 
From: from@example.com
To: to@example.com
Subject: HTML Messages with Embedded Pic in Signature
MIME-Version: 1.0
Content-Type: multipart/alternative; boundary="alternative_boundary"

This is a message with multiple parts in MIME format.

--alternative_boundary
Content-Type: text/plain; charset="utf-8"
Content-Transfer-Encoding: 8bit

test

-- 
[Picture of a Christmas Tree]

--alternative_boundary
Content-Type: multipart/related; boundary="related_boundary"

--related_boundary
Content-Type: text/html; charset="utf-8"
Content-Transfer-Encoding: 8bit

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <p>test</p>
        <p class="sig">-- <br><img src="cid:0123456789"></p>
    </body>
</html>

--related_boundary
Content-Type: image/png; name="sig.png"
Content-Disposition: inline; filename="sig.png"
Content-Location: sig.png
Content-ID: <0123456789>
Content-Transfer-Encoding: base64

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
cHkgSG9saWRheXMgUGFnZQA7

--related_boundary--

--alternative_boundary--

Vous pouvez l'importer dans Sylpheed ou Thunderbird (avec l'extension des outils d'importation/exportation) ou dans le client de messagerie intégré d'Opera. Ensuite, dans Opera par exemple, vous pouvez basculer sur "préférer le texte brut" pour voir la différence entre la version HTML et la version texte. De toute façon, vous verrez que la version HTML utilise l'image intégrée dans la signature.

Répondu el 2 de Février, 2012 par Shadow2531 (6726 Points )

0 votes

Il serait d'une grande aide si vous pouviez fournir quelques informations sur stackoverflow.com/questions/11124540/ .

Commenté el 20 de Juin, 2012 par M Sach

0 votes

@MSach J'y jetterai un coup d'œil quand j'en aurai l'occasion.

Commenté el 21 de Juin, 2012 par Shadow2531

0 votes

Pourquoi utilisez-vous le Content-Location pour stocker le nom du fichier ? C'est censé être un URI qui fonctionne comme un ID afin que vous puissiez faire référence à cette partie du corps à partir d'une autre partie du corps. Voir RFC 2557. Puisque vous ne l'utilisez pas de la manière prévue par la RFC, je suis curieux de savoir pourquoi vous l'incluez.

Commenté el 26 de Mars, 2013 par james.garriss

Afficher 18 autres commentaires

Answer 3

74voto

Tim Medora Points 30969

Important

Ma réponse ci-dessous montre comment intégrer des images en utilisant des URI de données. C'est utile pour le web, mais ne fonctionnera pas de manière fiable pour la plupart des clients de messagerie . Pour le courrier électronique Veillez à lire la réponse de Shadow2531. .

Les données en base-64 sont légales dans un img et je crois que votre question est de savoir comment insérer correctement une telle balise d'image.

Vous pouvez utiliser un outil en ligne ou quelques lignes de code pour générer la chaîne en base 64.

La syntaxe pour générer l'image à partir de données en ligne est la suivante :

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

http://en.wikipedia.org/wiki/Data_URI_scheme

Répondu el 2 de Février, 2012 par Tim Medora (30969 Points )

16 votes

J'ai essayé mais Gmail ne semble pas le prendre en charge. La solution de la pièce jointe intégrée semble toutefois fonctionner.

Commenté el 5 de Juin, 2012 par Indrek

0 votes

Bonjour Tim, cela nous aiderait beaucoup si vous pouviez nous fournir des informations sur les points suivants stackoverflow.com/questions/11124540/ . Merci d'avance. Une autre chose est qu'il y a une résolution pour que le domaine de messagerie comme Yahoo, Gmail supporte également votre solution.

Commenté el 20 de Juin, 2012 par M Sach

1 votes

Je pense que les pièces jointes (comme la solution de @Shadow2531) peuvent être la solution la plus largement supportée, mais la seule façon de le savoir est de tester plusieurs clients de messagerie majeurs avec différents paramètres de sécurité appliqués. Pour compliquer encore la question, vous pouvez recevoir des e-mails à la fois sur le Web et dans une variété de clients. Par exemple, Gmail peut se comporter différemment lorsqu'il est affiché sur le Web et dans Outlook ou Thunderbird.

Commenté el 20 de Juin, 2012 par Tim Medora

Afficher 4 autres commentaires

Answer 4

3voto

JerryP Points 401

Récemment, j'ai eu le même problème pour inclure une image QR/png dans un e-mail. L'image QR est un tableau d'octets qui est généré en utilisant ZXing. Nous ne voulons pas l'enregistrer dans un fichier car l'enregistrement/la lecture d'un fichier est trop coûteux (lent). Les deux réponses ci-dessus ne me conviennent donc pas. Voici ce que j'ai fait pour résoudre ce problème :

import javax.mail.util.ByteArrayDataSource;
import org.apache.commons.mail.ImageHtmlEmail;
...
ImageHtmlEmail email = new ImageHtmlEmail();
byte[] qrImageBytes = createQRCode(); // get your image byte array
ByteArrayDataSource qrImageDataSource = new ByteArrayDataSource(qrImageBytes, "image/png");
String contentId = email.embed(qrImageDataSource, "QR Image");

Disons que le contentId est "111122223333", alors votre partie HTML devrait avoir ceci :

<img src="cid: 111122223333">

Il n'est pas nécessaire de convertir le tableau d'octets en base64, car Commons Mail effectue automatiquement cette conversion pour vous. J'espère que cela vous aidera.

Répondu el 23 de Mars, 2015 par JerryP (401 Points )

Images codées en base64 dans les signatures de courriel

Réponses

Important

Questions en vedette

Top Tags

Prograide.com

Powered by:

Images codées en base64 dans les signatures de courriel

Réponses

Important

Questions en vedette

Top Tags

Dans notre réseau

Prograide.com

Powered by: