58

Image links in gmail are broken because of google's Image proxy (news1,news2). I can't load my site's images in gmail.

Actual image path is: http://sampleimageurl.com/images/logo.jpg

But I get the same image path like this in gmail:

https://ci3.googleusercontent.com/proxy/CUiMBo2ELdin8h5R_jKaarbsjQOZUXM3765smBK1PB4BsKq9EsVziwcOYFqjZqCkRDyu1jzoityEA_PJ=s0-d-e1-ft#http://sampleimageurl.com/images/logo.jpg

Does anyone knows how to solve this issue?

Community
  • 1
  • 1
Balaji Kandasamy
  • 4,115
  • 10
  • 36
  • 58

8 Answers8

50

Because your image wasn't open to public.

You need make sure the new Gmail image proxy can fetch your image from google server.

mrduguo
  • 920
  • 8
  • 5
  • 7
    +1 We run a QA test server with a special domain name we setup in our hosts file. This domain only has meaning on the appropriately setup computers. In the past, Gmail would display the link, which when viewing on a computer with the domain setup, would work because our PC knows the "clientsite.test" domain. Now Gmail pre-fetches by trying to load the image into their proxy DB. Except Gmail can't resolve the domain "clientsite.test" because it's not a public domain name. Gmail thinks the link is broken and therefor gives you a broken link, becaus of the new proxy change. – jmbertucci Dec 18 '13 at 21:43
  • 6
    For developping purposes, you can use this Javascript in your debugger console (F12) to display this pictures : (function(){ while(img = document.evaluate('//img[contains(@src, \'googleusercontent.com\')]', document,null,XPathResult.FIRST_ORDERED_NODE_TYPE,null).singleNodeValue){ var src = img.attributes.src.value; src = src.substr(src.indexOf('#')+1); img.attributes.src.value = src; } })(); – JBreton Mar 18 '14 at 16:32
  • @mrduguo I know this is a fairly old topic, but could you explain how you do this? – SomeAmbigiousUserName Mar 12 '15 at 16:49
  • 3
    Old topic, but it case it helps, an improvement on @JBreton's JS snippet. That one caused infinite loop if there's a URL with googleusercontent.com but no # in it. (function(){ var snapshot = document.evaluate('//img[contains(@src, \'googleusercontent.com\')]', document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); for (var i = 0; i < snapshot.snapshotLength; i++) { var img = snapshot.snapshotItem(i); var src = img.attributes.src.value; src = src.substr(src.indexOf('#')+1); img.attributes.src.value = src; } })(); – hook Mar 23 '16 at 21:25
10

In Google Apps, it's now possible to disable Image Proxy for GMail (in Apps Settings). Or, better, you can white-list your internal URLs for which image proxying should be disabled.

sereda
  • 1,640
  • 11
  • 11
5

DEG’s research has confirmed reports from wordtothewise blogger, Laura Atkins, that “Google is rewriting image links. This rewriting appears to be happening during the delivery process. Older messages that are currently in mailboxes aren’t showing this tracking.”

For global images, this means only one user has to open the mail and the images are pulled from the server. In the case of tracking images, every image file name is unique. Every new open will cause Google to grab the uniquely named image. The result is that senders can track the first open, but no subsequent opens.”

Reference: http://www.degdigital.com/blog/gmail-tracking-disruption-for-marketers/

Kumar V
  • 8,669
  • 8
  • 37
  • 55
  • ok bro. Due to this , image links are broken gmail. How to resolve this issue? – Balaji Kandasamy Dec 10 '13 at 10:20
  • 1
    At this point, we have no official word from Google on what actions are potentially to blame for these changes or how long they have been in place, but we will continue to research the problem to better understand its origins and implications for marketers. - Refer link posted in answer – Kumar V Dec 10 '13 at 10:22
  • What a train wreck. The images won't even load in the first place when I open a mail now with embedded URL images (just noticed this last night for the first time), but I also at least weekly have to copy and paste the contents of an email for a client into ConstantContact, and this is now screwed as well. WTF. – Nathan Beach Dec 12 '13 at 14:53
4

Two things that might help:

  1. Use traditional image formats like .jpg, .png, .gif (formats like svg do not always work)
  2. Make sure there are no spaces or strange characters in the image path (Check your server request logs. If it gives a 404 to google it is probably a link format issue.)
kravits88
  • 10,347
  • 1
  • 43
  • 48
0

Change the image's location. In the new Google setup, the first time an image is opened, Google downloads the image and caches it on a Google managed proxy.

dimarti
  • 1
0

I am from Asp.Net world, but I had the same issue.

  • Gmail could not cache image while I tested locally
  • image's .svg extension was problematic

So, I resolved this issue only by changing the image extension (to .png) and deploying the app to the server (in that case Gmail could access my image for caching and I saw the image in email).

Vladimir Krasko
  • 1
  • 1
0

Had similar issue with and it was because I had .htpasswd turned on for my staging site.

Joel Fernandes
  • 151
  • 1
  • 7
-4

I had the same issue and I solved the problem hosting the images in my public server (http://mydoamin.com/img/images.jpg).

Next step responsive email displaying responsive images: CSS

@media only screen and (max-device-width: 480px) {
   td.headercell { 
      background-image: url(images/header-650@2x.png) !important;
      background-size: 325px 115px;
      width: 325px !important;
      height: 115px !important;
   }
   td.headercell img {
      display: none;
   }
}
JLF
  • 2,070
  • 3
  • 24
  • 41
Yassine Ahram
  • 1
  • 1