Javascript 防止在网页上缓存图像

我正在使用IHttpHandler在网页上显示存储在azure blob中的图像。这个很好用。我还为用户提供了旋转图像的能力。旋转图像的代码正在工作。但是，当我尝试向用户显示旋转后的图像时：

document.getElementById("imageControl").src = "/ImageHandler.ashx?container=images&ID=blobFileName;

虽然存储在“blobFileName”中的图像已更改，但页面上显示的图像未更新。经过一些尝试和错误后，我发现如果我将旋转的blob存储在一个新文件名下，请说“blobFileNameRotated”，代码如下：

document.getElementById("imageControl").src = "/ImageHandler.ashx?container=images&ID=blobFileNameRotated;

工作并显示旋转的文件。我假设原始代码不起作用，因为浏览器缓存了图像？我试着在几个浏览器中运行代码，发现在Chrome中原始代码可以工作，但只适用于小文件，在IE11中根本不起作用

---

我的问题是，如何控制浏览器如何缓存图像文件（如果存在问题），并强制浏览器重新显示图像，即使我没有更改文件名。我尝试将src设置为另一个文件，然后返回到blob文件，但没有成功。

这不是Azure的问题，但有几件事需要尝试：

您可以向图像处理程序URL添加缓存清除器。我建议在末尾添加一个随机数，以强制浏览器重新请求URL。问题是不会缓存任何图像。例如：

document.getElementById（“imageControl”）.src=“/ImageHandler.ashx？container=images&m=“+Date.now（）

使用相同的方法，但输出要显示的图像的数量，并将Date.now（）更改为am image name/ID，以便我们在旋转时最终将得到应缓存的相同图像

//使用一些服务器端逻辑进行输出。

var-imageIds=新数组（“ImageA”、“ImageB”、“ImageC”）

//在eventHander中，具有类似于：

document.getElementById（“imageControl”）.src=“/ImageHandler.ashx？container=images&ID=“+imageIds[currentImage]”文件

确保在hander的C#代码中设置了正确的缓存头。看

---

很抱歉对这个问题反应太慢，我的解决方案有点起作用，所以我才抽出时间来测试Simon更好的解决方案。我想我会添加一些我在这一过程中发现的其他东西，以防其他人来问这个问题，寻找有关斑点和图像的信息

我的解决方案是每次旋转文件时更改文件名。这意味着每次旋转90度，我都会存储一个新的水滴。这是可行的，但Simon的解决方案只涉及更改对imagehandler的调用，因此blob文件名不需要更改

我最初遇到了问题，因为我在旋转blob之后没有设置它的内容类型。当我试图在报告中使用该图像时，代码抱怨，因为它不是图像类型

请注意，如果要从正在旋转的blob复制内容类型，则在执行以下操作后，该内容类型不可用：

    Dim blob As ICloudBlob = GetBlob(sContainer, blobFileName)

但只有在下载blob之后：

    blob.DownloadToByteArray(byteData, 0)

这也让我在另一个时间绊倒了，因为我假设找到了一个blob，因为我没有在

dim blob as

代码行上得到错误，而事实上，由于我输入了错误的容器名称而找不到它

快乐的呕吐