强制浏览器发送图像的 http 请求

Force the browser to send http request for an image

本文关键字:http 请求 图像 浏览器      更新时间:2023-09-26

我有一个应用程序,它使用 JavaScript 动态加载图像并将它们绘制到画布上。图像可以更改,但我也想利用缓存,所以我使用上次修改的 http 标头并在图像未修改时发送 304 响应。这一切都很好,似乎正在工作...

但是发生了一件奇怪的事情(到目前为止只在 Chrome 和 OSX 上的 Safari 中进行了测试(,浏览器偶尔会忽略发送图像请求!在脚本中,我做了一个new Image()onload函数触发,但是当我使用网络检查器时,永远不会发出请求。我还可以在服务器端确认未收到请求。

具有

空缓存响应的原始请求具有以下标头:

Connection:keep-alive
Content-Length:25937
Content-Type:image/png
ETag:Thu, 10 May 2012 20:48:13 GMT
Last-Modified:Thu, 10 May 2012 20:48:13 GMT

浏览器不应该每次对此图像发出新请求吗,因为它具有上次修改的标头?当我运行测试时,浏览器似乎每分钟左右只发出一个新请求(无论我尝试加载同一图像的多少副本(......这是预期的行为吗?是否有一些标题组合会强制浏览器每次检查图像是否被修改?或者也许一些JavaScript魔法可以做到这一点?

我不知道

你是否找到了解决问题的方法,但我一直在为完全相同的问题而苦苦挣扎,我想我现在有一个解决方案。我所做的是使用 ajax 调用来发出请求,而不是将图像作为 image/jpeg 类型的文件返回,而是将数据作为base64_encoded数据返回,在客户端,我通过将 src 设置为数据 uri 来渲染 img。使用jQuery,它看起来像这样:

jQuery.ajax({
    url: imageURL,
    headers: {'Max-Age':0},
    success: function(d){
                jQuery(imgElement).attr('src','data:image/jpeg;base64,'+d);
             },
    error: function(){/*handle error*/},
    complete: function(){/* handle complete*/}
 });

这对我有用。我希望这对你有所帮助。