jquery - 将img src设置为已经由浏览器加载的图像 - 导致在Safari中重新加载图像

Question

我正在使用此javascript代码将图像src设置为现有图像的图像src：

var src = $('#thumbnailImg' + pageNum).attr('src');
$('#mainAppImageImg').attr('src', src);

在Firefox和IE中，它按预期工作 - 图像使用现有图像，不再从服务器请求图像。

在Safari中，它会导致从服务器重新加载图像。我认为这是因为我对服务器返回的图像标题做错了，但这不是我所了解的主题。

您可以在此处查看此操作：http://www.las.si/tryitout.php。

Answer 1

正如Dev所说：

  

默认情况下，图像将重新加载

您应该使用图像文件夹上的.htaccess文件强制服务器缓存图像：

Header unset Pragma
Header set Cache-Control "public, max-age=10000, must-revalidate"

这样，safari和chrome将重用您的浏览器缓存。

您也可以搜索使用canvas元素在base64，服务器端或客户端编码图像。