Wie in der Abbildung gezeigt, wird festgestellt, dass nach dem Vorladen des Bildes ein wiederholtes Laden der Bildressourcen ausgelöst wird, wenn das Bild wiederholt aufgerufen wird (stellen Sie sicher, dass der Bildressourcenpfad konsistent ist).
Auf dem Mobiltelefon wurde keine solche Situation gefunden, aber auf Chrome kann eine ähnliche Situation leicht auftreten, und die wiederholt geladenen Bildressourcen sind jedes Mal unterschiedlich.
Nach ein- oder zweimaliger Wiederholung der Anfrage wird die Anfrage nicht noch einmal wiederholt.
Was ist der Grund für diese Situation?
HTML-Header
Gleiche Frage zum Stackoverflow: https://stackoverflow.com/que...
http请求是304，实际上这张图片是从浏览器缓存里面加载的
引用： 对 HTTP 304 的理解
最近和同事一起看Web的Cache问题，又进一步理解了 HTTP 中的 304 又有了一些了解。
304 的标准解释是：Not Modified 客户端有缓冲的文档并发出了一个条件性的请求（一般是提供If-Modified-Since头表示客户只想比指定日期更新的文档）。服务器告诉客户，原来缓冲的文档还可以继续使用。
如 果客户端在请求一个文件的时候，发现自己缓存的文件有 Last Modified ，那么在请求中会包含 If Modified Since ，这个时间就是缓存文件的 Last Modified 。因此，如果请求中包含 If Modified Since，就说明已经有缓存在客户端。只要判断这个时间和当前请求的文件的修改时间就可以确定是返回 304 还是 200 。对于静态文件，例如：CSS、图片，服务器会自动完成 Last Modified 和 If Modified Since 的比较，完成缓存或者更新。但是对于动态页面，就是动态产生的页面，往往没有包含 Last Modified 信息，这样浏览器、网关等都不会做缓存，也就是在每次请求的时候都完成一个 200 的请求。
因此，对于动态页面做缓存加速，首先要在 Response 的 HTTP Header 中增加 Last Modified 定义，其次根据 Request 中的 If Modified Since 和被请求内容的更新时间来返回 200 或者 304 。虽然在返回 304 的时候已经做了一次数据库查询，但是可以避免接下来更多的数据库查询，并且没有返回页面内容而只是一个 HTTP Header，从而大大的降低带宽的消耗，对于用户的感觉也是提高。
当这些缓存有效的时候，通过 HttpWatch 查看一个请求会得到这样的结果：