如何强制更新电子邮件签名中包含的图片缓存？

Question

我想在我们的电子邮件签名中包含一张图像，显示有关传入事件的信息。 为了避免每个人每 3 个月更新一次图像签名，我希望能够在我们的服务器上更改此图像，以便更新电子邮件签名。

问题是，缓存会阻止它并在我更改图像时显示图像的先前版本。

为了避免影响交付能力，我尝试仅在 html 中寻找解决方案。

我需要显示的图像是最新的，而不更改源网址或图像。我只是替换服务器上的图像。

我尝试向每次修改图像时都会更改的网址添加一个变量，以强制客户端再次下载它，但它不起作用。

这是我对图像的称呼：

<img style="display: block; max-width: 430px;" src="https://loremipsum.com/cdn/shop/files/event_banner.png" alt="event_banner" width="430" />

我尝试过这个：

<img style="display: block; max-width: 430px;" src="https://loremipsum.com/cdn/shop/files/event_banner.png?lastModified("https://loremipsum.com/cdn/shop/files/event_banner.png") alt="event_banner" width="430" />

Answer 1

更改图像路径将是最简单的解决方案。也就是说，每次需要收件人查看新图像时都无需更改图像路径。您可以改为添加 URL 参数，这些参数会发生变化以强制电子邮件客户端清除其缓存。

请参阅以下示例：

document.getElementById('email-img').src = `https://www.eteknix.com/wp-content/uploads/2015/06/imgur-e1433423720776-800x508.jpg?date=${new Date().getTime()}`;

console.log(document.getElementById('email-img').src);

<img id="email-img" style="display: block; max-width: 430px;" src="https://www.eteknix.com/wp-content/uploads/2015/06/imgur-e1433423720776-800x508.jpg" alt="event_banner" width="430" />

我所做的就是将

new Date().getTime()

添加到图像 src 路径末尾的组成日期变量中。通过此添加，您可以始终确保向用户显示服务器上定义的文件路径中的最新图像。

Answer 2

我们通过使用图像的 PHP 文件解决了这个问题：

<img src="https://website.be/Emailsignatures/redirect_image.php">

在位于我们服务器上的 Emailsignatures 文件夹中的redirect_image.php 文件中，我们添加了以下代码以重定向到实际图像：

<?php header("Location: https://website.be/Emailsignatures/new-image.gif"); die(); ?>

这使我们能够更新图像名称，而无需在每台计算机上安装 HTML 签名，并且由于我们更改了图像名称，因此不会缓存该文件。