web-dev-qa-db-ja.com

GmailにHTML画像が表示されない

HTML形式の電子メールニュースレターを送信しています。 HTMLの中には次のようなものがあります

<img height='70' width='70' style='display:block' src='myDomain.com/imageName.png'>

ThunderbirdまたはOutlookでニュースレターを開くと、画像が表示されています。ただし、Gmailで開くと、画像は表示されません。 Gmailがセキュリティ上の理由で使用するプロキシに関するものなのか、それとも別のものなのかはわかりません。いずれにせよ、私は誰かがこれに遭遇したかどうか、もしそうなら、それがどのように解決されたかを知りたいです。

49
Rita

パーティーに遅れましたが、ここに行きます...私もこの問題を経験しました、そして、それは以下で解決されました:

  • Src urlにスキームを含める(「//」を使用しても機能しない-完全なスキームEGを使用する:「https://」)
  • 幅と高さの属性を含める
  • Style = "display:block"属性を含む
  • Alt属性とtitle属性の両方を含める

例えば:

<img src="https://static.mydomain.com/images/logo.png" alt="Logo" title="Logo" style="display:block" width="200" height="87" />
41
Howard

Googleでは、信頼できるソースからの画像のみを許可しています。

そこで、Googleドライブで画像をホストし、そのURLを画像のソースとして使用することで、この問題を解決しました。

例:with:http://drive.google.com/uc?export=view&id=FILEID '>

uRLを作成するには こちらを参照 にしてください。

26
Sachin Gade

エンコードも確認してください:Googleはスペースを+ではなく%20としてエンコードします。これにより、画像リンクが無効になる場合があります。

8
pHOW

画像にtitleおよびaltプロパティを追加してみてください。Gmailや他のいくつかは、属性のない画像をブロックします。また、スパムとして読み取られるメールを含めるロジックです。

6
Hugo S. Mendes

Gmailの設定でそれらを無効にしている可能性があります。それらを変更するためのリンクがあります https://support.google.com/mail/answer/145919?hl=ja

また、Gmailは、疑わしいと思われる画像をブロックしている可能性があります。

上記のリンクから。

Gmailが画像を安全にする方法

一部の送信者は外部リンク画像を有害な方法で使用しようとしますが、Gmailは画像が安全にロードされるように対策を講じます。 Gmailはすべての画像をGoogleの画像プロキシサーバー経由で配信し、配信前にトランスコードして次の方法でユーザーを保護します。

送信者は、画像の読み込みを使用してIPアドレスや場所などの情報を取得することはできません。送信者はブラウザでCookieを設定したり読み取ったりすることはできません。 Gmailは、既知のウイルスまたはマルウェアの画像をチェックします。場合によっては、送信者は、個人が一意の画像リンクでメッセージを開いたかどうかを知ることができます。いつものように、Gmailはすべてのメッセージをスキャンして疑わしいコンテンツを探します。Gmailが送信者またはメッセージを疑わしいと判断した場合、画像は表示されず、画像を表示するかどうかを尋ねられます。

6
codeaddict

私にとって、問題はsvg画像の使用でした。私はそれらをpngに切り替えましたが、うまくいきました。

4
Ruben Miquelino

HTTPまたはHTTPSは完全なアドレスである必要があります

background-image:url( http://fulladdress.com/ca/1/product_assets/T/C/X/M/K/NMTCXMK_mu.jpg

var mailOptions = {
  from: '[email protected]',
  to: emails,
  subject: 'i super another ma node mailer cool test',
  text: 'That was easy!',
  html: '<a href="//google.com"><div style="background-image: url(http://fulladdress.com/ca/1/product_assets/T/C/X/M/K/NMTCXMK_mu.jpg);width:500px;height:500px">ascfas</div></a>'
};
2
D V Yogesh

Gmailが上記のすべての問題、altなどをすでに修正していることを知っています。

これは質問とは無関係ですが、おそらく誰かが私と同じことを経験します。

したがって、私のWebデザイナーは"img"の代わりに"image"タグを使用しますが、症状は同じでした。 Outlookでは機能しますが、Gmailでは機能しません。
気づくまでに1時間かかります。ため息、そのような時間の無駄。

したがって、タグが"img"ではなく"image"であることを確認してください。

1
Esgi Dendyanri

私の問題は似ていました。これは、GmailでのIMGタグのテストに関する私の経験です(組織のほとんどがdev qaとprodサーバーを持っていると仮定します)。

個人のメールIDでお客様にメールを送信する必要があり、Gmailがimgタグのsrc属性に続くような独自のメールを追加することがわかりました。開発環境からこれらの画像を送信するとき、Gmailでレンダリングすることはありませんでした常に興味がありました

https://ci7.googleusercontent.com/proxy/AEF54znasdUhUYhuHuHuhHkHfT7u2w5zsOnWJ7k1MwrKe8pP69hY9W9eo8_n6-tW0KdSIaG4qaBEbcXue74nbVBysdfqweAsNNmmmJyTB-JQzcgn1j=s0-d-e2-ft#https://www.prodserver.com/Folder1/Images/OurImage.PNG

次のように私のGmail IDに送信された画像は私のために働いたことはありません

<img src="https://ci7.googleuser....Blah.Blah..https://devserver.com/Folder1/Images/OurImage.PNG">

開発サーバーでは、Chrome(または任意のブラウザー)で次のURLを押してもこの画像をレンダリングできません。

https://www.devserver.com/folder1/folder2/myactualimage.jpg

srcがwwwを持っている限り、常に機能し、他の属性を追加する必要はありませんでした。

<img src="https://www.**prodserver**.com/folder1/folder2/myactualimage.jpg">
0
Sandeep

私はこのパーティーに後ほど参加しますが、約2時間かけて思いがけないすべてを試してみて、運がなかった後、写真をGOOGLE DRIVEではなくGOOGLE PHOTOSにアップロードすればうまくいくことに気付きました。次に、写真を右クリックしてアドレスをコピーし、貼り付けると、うまく機能します。

0
Paige O