无法强制Web服务器从磁盘

Question

背景

我的目标是构建一个显示页面幻灯片的Web服务器。有些幻灯片可能只是一张图片，有些则是带有css的文字。

安全

没什么好看的，它不会暴露在外面的世界里。

接口

用户必须能够修改文本幻灯片中的文本。

用户必须能够修改幻灯片上显示的图像。

图像必须以自动方式更改（网络上的另一台机器会创建一个图像，并且应该能够将该图像推送到服务器进行显示。或者，服务器应该能够以任何方式下载图像本身）

我得到了什么

在这个领域知之甚少，我开始阅读和修补。 LAMP服务器似乎很简单。

我复制了一个slideshow container from w3（根据知识渊博的人，我后来发现这是一个不好的来源），并删除了我不需要的东西。

我创建了：

• 表单供用户输入文本，保存在纯文本文件中（好吧，在我更新Ubuntu之前工作，我想包升级破坏了一些东西，现在表单只显示原始的PHP代码。编辑：需要重新启用mods，可能是因为php从5升级到7：sudo a2enmod php7.2）。
• 我自己的html文本幻灯片，从文件中读取。修改后从文件中读取它是一件麻烦事。我认为txtFile.setRequestHeader('pragma', 'no-cache');就是这样做的。
• 带有本地图片的幻灯片

我真正的实际问题

复制新图像代替用作图像幻灯片输入的文件不会更改服务器显示的图像。这似乎是一个普遍的问题，并且在一年中提出了几种解决方案。这些都没有成功。文件和地址末尾的随机字符串（难以自动化？），这篇文章在我的index.html中：

+    <!-- attempt to reload images on change, does not work: -->
+    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
+    <meta http-equiv="Pragma" content="no-cache" />
+    <meta http-equiv="Expires" content="0" />

在避免缓存方面，浏览器（至少是chrome）似乎也越来越受到限制。

因此，在我的设置（Ubuntu 18.04，LAMP的apt软件包和最近的chrome）中，如何在显示幻灯片时让我的服务器从磁盘重新加载图像？

编辑：我不想点击刷新，服务器应该自动重新加载图像。

另一个模糊的问题，实际上可能是罪魁祸首

我做事奇怪吗？感觉发展这比它应该更麻烦，所以我可能走错了路。你会引导我去另一个更有意义的方向吗？

Answer 1

您正尝试停用浏览器缓存。虽然原则上缓存非常简单：浏览器会保存已加载的资源，并在后续请求中从内存中提供这些资源，但是跨浏览器/跨设备禁用它会相当复杂。

您可以做的最简单的事情是为您的图片添加一个独特的参数，以欺骗浏览器相信它是另一个：

<img src="/path/to/image.jpg?v=<?php time(); ?>">

这将使您的浏览器始终加载<img>，因为它会认为它是一个新文件。但是，禁用浏览器缓存（尤其是图像）会严重影响性能。

更好的方法是为图像分配唯一标识符并保存（在数据库中），因此只有在文件更改后，它们的唯一参数才会更改。

这是一种没有数据库的方法，因为您需要知道的是上次替换图像的时间：

• 在图片上传处理脚本中，成功上传后，还会在服务器上的文件中写入当前时间戳（即：timestamp.txt）。
• 在您的标记中，使用此文件的内容标记您的图像：
  <img src="path/to/file.jpg?v=<?= file_get_contents('./timestamp.txt'); ?>">
• 每隔几秒钟打一次ajax调用timestamp.txt。当timestamp.txt的内容与v的{​​{1}}参数不同时，请将src值替换为新的时间戳，从而使浏览器立即重新加载文件。
  注意：除非你确定没有，否则ajax本身会被缓存：
  src

Answer 2

您可以强制Web服务器通过更改其URL来从磁盘重新加载映像。由于您不想经常更改其名称或路径，因此您将为其指定一个v参数，例如：

<img src="/images/myimage.png?v=2">

如果您想再次重新加载，请将其更改为

<img src="/images/myimage.png?v=3">

等等。