无需往返服务器即可将 dataURL 图像保存到缓存

Question

在我的网络应用程序中，用户将图像从他们的桌面拖到浏览器窗口中。然后我使用 FileReader 的 readAsDataURL 在浏览器中显示图像，正如我描述的 here。然后我可以将图像上传到服务器。浏览器中的 JavaScript 可以提前知道图片的新 URL 是什么。

有没有办法告诉浏览器：“这是你要从这个 URL 下载的数据，但没有必要下载，因为它已经在这里可用了。就用这个吧。”?我的目标是将图像放入浏览器的缓存中，以便使用真实的 URL（而不是 dataURL）来显示图像。这意味着当这些图像（暂时）不再显示时，浏览器可以负责从内存中卸载这些图像。

您对如何减少不必要的带宽使用有什么建议吗？

Answer 1

如果我错了，请纠正我，但我了解您希望浏览器使用来自桌面的数据显示图像，而不是来自上传图像的服务器。

据我所知，浏览器缓存在很大程度上依赖于 URL，所以我不明白如何告诉浏览器使用本地数据而不是远程数据。

但是，您可以：

• 直接从磁盘加载图像（您有本地路径）。但是，您在代码中有本地路径
• 使用本地存储（见Saving and loading an image from localStorage）将图片保存到本地并获取