我正在开发一个网站，其主要内容是图像，我将其作为<img>标签放在背景中（将它们作为由媒体查询管理的 CSS 背景属性不是一种选择）。
我已经导出了每个图像的 6 个尺寸版本，从 Javascript 中设置了一个 cookie，指示用户屏幕尺寸属性，我可以通过 PHP 提供与客户端相关的图像：对于大屏幕，宽度= 1680px ，宽度= 800px用于中型屏幕等。我有一个特殊的小屏幕布局<=560px完全隐藏幻灯片，只打印有用的文本内容，在这种情况下 PHP 输出 1x1px 透明图像以节省带宽。
根据该架构的定义，自适应图像的 URL 是恒定的，我无法通过向 URL 添加参数来控制浏览器缓存。但我的问题是，在某些情况下，主要是方向的变化（假设移动设备的宽度为 800 CSS 像素，高度为 480 CSS 像素）从浏览器缓存中检索到“错误”的图像版本，并且不是来自服务器。
我确实想缓存图像，但是对于完全相同的 URL，比如说http://www.mysite.com/media/image/s1/id38/images/image1-318970.jpg，我希望能够控制- 来自 PHP 和发送的标头 - 文件的不同缓存版本（相对于磁盘上的每个实际文件版本）。我已经查看了ETag标题，但我不确定从那里去哪里，也不知道如何生成ETag值。
有人已经解决了这个问题或类似问题吗？