在不缓存跨域的情况下获取图像或其标头答案

【问题标题】：Get Image or its Headers Without Caching Cross-Domain在不缓存跨域的情况下获取图像或其标头
【发布时间】：2014-07-14 05:15:37
【问题描述】：

我正在尝试检索图像的大小而不缓存它（出于正当理由），或者在不下载图像本身的情况下获取其Content-Length 标头。我需要这些信息来将远程图像与控制图像相匹配（如果有另一种方法可以通过这些限制实现这一点，我会全力以赴）。服务器不受我控制。这是我尝试过的：

使用这个脚本，我可以轻松获取图像，但无法阻止其缓存：

var img = new Image();
img.src  = 'http://www.nasa.gov/sites/default/themes/NASAPortal/images/nasa-logo.gif';

有了这个，我在调试器中获得了标题，但我无法访问它们：

$.ajax({
    url: 'http://www.nasa.gov/sites/default/themes/NASAPortal/images/nasa-logo.gif',
    type: 'HEAD',
    success: function(data){
        console.log(data);
    }
});

~~有了这个，我得到了没有缓存的图像，但我无法访问它的属性：~~

<iframe src="http://www.nasa.gov/sites/default/themes/NASAPortal/images/nasa-logo.gif"></iframe>

我尝试了所有 JSONP 组合，包括 converters 和 dataFilter，但均未成功。
我已经探索过仅下载图像的前 n 个字节的可能性（这样缓存就不会成为问题），但似乎只有 AJAX 才有可能，因为它是跨域和 JSONP 似乎也不起作用。

总之，我已经尝试了所有我能阅读和思考的东西......我花了过去 48 小时（和数百个小提琴）寻找解决方案。我一直觉得，有了以上这些，应该有办法……

我错过了什么？

【问题讨论】：

标签： javascript jquery caching browser-cache

【解决方案1】：

添加一个查询字符串来避免缓存怎么样

var img  = new Image();
var rand = (new Date()).getTime();;

img.src  = 'http://www.nasa.gov/ ... /images/nasa-logo.gif?r=' + rand ;

【讨论】：

图像仍然被缓存（至少在 FF 29 中）。我相信这会迫使浏览器每次都重新下载它。
呃，如果浏览器每次都重新下载图片，它并没有被缓存，这是什么意思？
嗯，图片在浏览器的缓存中仍然可见，这是我无法拥有的。
@chris - 但使用随机查询字符串使其成为“不同”的图像，因此它并没有真正被缓存。如果您的意思是您仍然可以在控制台中将图像视为已加载的资源这一事实，那么没有办法解决这个问题，这就是您加载图像时发生的情况，无论缓存如何。
我不担心控制台，但由于我下载的图像包含机密数据，我不能将它留在用户的 PC（浏览器的缓存）上。因此需要防止缓存。或者，有没有办法只下载图像的一小部分而不是整个文件？做我的检查，任何伪唯一的东西都可以工作，比如文件大小、前 100 个字节，甚至最后修改日期。

【解决方案2】：

你可以获取系统毫秒并在url末尾添加'?time='+milliseconds，大多数http缓存都是以url为key的，所以你可能会在每次请求时得到一个新的图像

【讨论】：

【解决方案3】：

您可以使用以下响应标头提供图像：

缓存控制：无缓存，无存储

这将阻止浏览器缓存它，包括代理服务器。

【讨论】：

如前所述，很遗憾无法控制服务器。