谷歌AMP图像请求是404'ing

Question

我的AMP页面正在通过验证，但一些图像是404'ing。从我的站点访问页面时，图像加载正确。然而，当从谷歌的AMP CDN加载页面时（我相信它们会缓存所有页面），某些图像返回404。

在网络选项卡中，我注意到图像GET请求在我的网站上是正确的（内容类型：图像/png）。另一方面，谷歌的缓存页面为没有加载的图像发出一个带有内容类型“文本/html”的GET请求。GET响应是指示404的基本超文本标记语言页面。

应该注意的是，一些图像确实加载成功。它们存储在图像文件夹中，并远程存储在解析服务器上。两个图像位置都成功地提供了图片，只是不是所有的时间；我似乎找不到任何不一致的地方，可能导致一些人响应200，另一些人响应404。

我将非常感谢任何提示，以找出这一个！

编辑：有没有可能谷歌还没有缓存这些图像？页面本身肯定是缓存的。

Answer 1

问题定位！这些图片最初是从谷歌的图像应用编程接口中提取的。API允许我指定文件格式（我想要. png）。不幸的是，如果谷歌的图像是一个JPEG，他们只是添加了一个. png扩展，然后返回给我。

基本上，如果AMP-IMG需要example.png，那么它只在example.png是真正的png编码时才起作用（您可以通过在文本编辑器中打开文件来判断编码，png在顶部附近会有一个“png”）。

在我的例子中，example.png实际上是将example.jpg重命名为example.png（仍然是jpeg编码）。谷歌的缓存服务不喜欢这样，返回了404。

我只是将所有照片重命名为.jpg扩展名，然后使用Photoshop将它们批量转换为true.png。希望这对其他人有帮助！

Answer 2

当加载您的示例链接时，我得到一个404https://cdn.ampproject.org/ii/w1000/s/chargehub.com/images/city_images/633_Image.png.当我从服务器请求相应的原始图像时，我看到一个Cache-Control： no ache标头：

% HEAD https://chargehub.com/images/city_images/633_Image.png | grep Cache-Control
Cache-Control: no-cache

虽然我不知道为什么其他图像也使用缓存控制：no Cache，比如https://chargehub.com/logos/ChargeHub-Logo.png，请不要缓存，我会尝试指示您的web服务器不要设置此标头，以查看这是否有帮助。

Answer 3

问题是您使用的是图像的相对路径，而不是绝对路径。所以下面的

<amp-img ... src="/images/city_images/633_Image.png">

需要成为

<amp-img ... src="https://chargehub.com/images/city_images/633_Image.png">

这会解决你的问题。