web-dev-qa-db-fra.com

Images Base64 vers Gmail

Je génère des images en ligne pour un e-mail envoyé depuis l'iPad. A l'air bien dans tous les clients de messagerie de bureau, mais gmail ne semble pas aimer l'image base64 et elle apparaît sous forme de texte.

Quelqu'un a-t-il de la chance d'intégrer des images avec base64 et gmail? Ou connaissez-vous une meilleure solution pour envoyer des e-mails HTML avec des images de l'iPad?

htmlemailipadgmailbase64
46
Steven Baughman

Les liens de Moin Zaman montrent des résultats de tests obsolètes (depuis 2008). Depuis mes tests approfondis aujourd'hui, Gmail prend en charge l'affichage d'images intégrées pour les deux méthodes.

Utilisez l'image de codage base64 en ligne dans <img src="...">

<html><body><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA9QAAADmCAIAAAC77FroAAAAAXNSR0IArs4c6QAAAAlwSFlzAAAO..."></body></html>

Utiliser une image encodée en base64 comme pièce jointe

Message-ID: <[email protected]>
Accept-Language: en-US
Content-Language: en-US
X-MS-Has-Attach: yes
X-MS-TNEF-Correlator:
x-originating-ip: [xxx.xxx.xxx.xxx]

Content-Type: multipart/related;
    boundary="_038_BE0243A40B89D84DB342702BC5FD6D313EA3BE1BBYMAIL_";
    type="multipart/alternative"
MIME-Version: 1.0
Return-Path: [email protected]
X-OriginatorOrg: example.com

--_038_BE0243A40B89D84DB342702BC5FD6D313EA3BE1BBYMAIL_
Content-Type: multipart/alternative;
    boundary="_000_BE0243A40B89D84DB342702BC5FD6D313EA3BE1BBYMAIL_"

...skipping Content-Type: text/plain which would be here for this example...

--_000_BE0243A40B89D84DB342702BC5FD6D313EA3BE1BBYMAIL_
Content-Type: text/html; charset="iso-8859-1"
Content-Transfer-Encoding: quoted-printable

<html><body><img border=3D"0" width=3D"980" height=3D"230" id=3D"Picture_x0020_1" src==3D"cid:[email protected]"></body></html>

--_000_BE0243A40B89D84DB342702BC5FD6D313EA3BE1BBYMAIL_--

--_038_BE0243A40B89D84DB342702BC5FD6D313EA3BE1BBYMAIL_
Content-Type: image/png; name="image001.png"
Content-Description: image001.png
Content-Disposition: inline; filename="image001.png"; size=32756;
    creation-date="Mon, 08 Oct 2012 15:27:07 GMT";
    modification-date="Mon, 08 Oct 2012 15:27:07 GMT";
Content-ID: <[email protected]>
Content-Transfer-Encoding: base64

iVBORw0KGgoAAAANSUhEUgAAA9QAAADmCAIAAAC77FroAAAAAXNSR0IArs4c6QAAAAlwSFlzAAAO
xAAADsQBlSsOGwAAf5lJREFUeF7tvQlgVdW18L+ZR20mpsSLCYlBQKwgwRCMr9TAqzg0CAl98Y9a
ikBfHxL1A/r0tUr77Feg1mDav4LUijxTk8hLRIstQ2mJhEiAWAEpNCGRa8KUSQXCzLf2cOZz7j33
5s5Zx6j3nruHtX97n33WWWfttbtdv36d4IEEkAASQAJIAAkgASSABJCA/wl0938VWAMSQAJIAAkg
ASSABJAAEkAClAAq3zgOkAASQAJIAAkgASSABJBAgAig8h0g0FgNEkACSAAJIAEkgASQABJA5RvH
...

Pour effectuer vos propres tests, vous pouvez envoyer un e-mail avec une image intégrée en ligne en utilisant l'une des techniques suivantes

Envoyez un e-mail à l'aide de l'un des éléments ci-dessus à votre compte Gmail, puis ouvrez l'e-mail dans Gmail Web Client (tout navigateur qui fonctionne) et utilisez la flèche vers le bas à côté du bouton Répondre pour choisir l'option Afficher l'original. Cela vous montrera comment il est reçu.

Je pense que la meilleure pratique consiste à utiliser l'image intégrée comme méthode de fixation.

Lors de mes tests avec Gmail Web Client, si j'envoyais 30 images dans un seul e-mail de différentes tailles, quelques-unes ne se chargeraient pas avec succès en affichant le conteneur d'images mais pas l'image. Si cela se produit, essayez de recharger la page.

Dans mes tests (Windows 7) ...

  • Chrome (le plus récent) avait besoin de quelques rechargements pour réussir à charger/afficher les 30 images
  • Opera (dernier) n'afficherait pas avec succès les 30 images quel que soit le nombre de rechargements
  • Firefox (dernier) a toujours montré les 30 images sans problème
  • Internet Explorer 9 (le plus récent) a toujours affiché les 30 images sans problème
  • Safari (dernier) a toujours montré les 30 images sans problème
21
cusman

Il ne semble pas y avoir de documentation officielle, mais Gmail ne le prend certainement pas en charge, en ligne ou en tant que pièce jointe en base64.

Voici quelques tests que le moniteur de campagne a essayés:
Incorporation d'images dans les e-mails
Incorporation d'images revisitées

8
Moin Zaman

Assurez-vous de définir Content-Type: multipart/mixed; , frontière et Content-Transfer-Encoding: base64

4
valexa

Cela fonctionne très bien: j'ai défini deux attributs src, l'un avec data: image/png; base64 et l'autre avec le lien vers l'image. Lorsque vous utilisez gmail, il utilise l'attribut src avec un lien et lorsque vous utilisez un autre client de messagerie, il utilise l'attribut src avec des données: image/png; base64. Essayez-le !. tu verras.

0
Ivan Extremera