Javascript 将图像从API下载到特定目录

我的目标是在ReactJS中创建一个离线工作的程序。也就是说，程序将在本地存储信息，并且只有在需要更新时，才会连接到internet并使用API下载

此时，我选择将来自API的信息存储在LocalStorage中

componentDidMount(){
    fetch('api.url')
      .then(response => response.json())
      .then(data => localStorage.setItem('fromAPI',JSON.stringify(data)))
  }

---

我的问题是：所讨论的API将包含照片，并且有必要下载这些照片以在本地存储它们。如何在本地存储它们？

我不知道您是否要保存图像URL

如果没有，可以保存图像的base64， 了解如何将图像转换为base64。 这是一个很好的软件包，您可以使用：

---

你说的本地存储是什么意思

您的web应用无法随心所欲地访问用户的硬盘。您可以使用下载提示符下载资源，也可以直接下载到用户设置的下载文件夹，但要重用资源，您需要用户授予您对资源的上载访问权限（使用

input[type=file]

）。我想这不是你想要的

---

或者，您可以将文件存储在

localStorage

中，大概是base64编码的。（尽管我认为utf16也可以）请注意localStorage的大小限制，根据浏览器的不同，大约有5-10MB。

我的目标不是在线创建web应用程序。我打算创建类似于a）的东西，其中一些信息（day，ppl）将存储在本地存储中。对于每张照片，API返回一个url（来自API本身）和照片：``“imgs”：[{“id”：167，“listImg”：“API.url/file/img name.jpg”}]``我的目标是在连接到internet时将照片下载到React应用程序的目录中，因此，当我断开照片连接时，它们将保持保存状态，程序将显示它们。然后尝试以下操作：注意存储限制。我的目标不是在线创建web应用程序。我打算创建类似于a）的东西，其中一些信息（day，ppl）将存储在本地存储中。对于每张照片，API返回一个url（来自API本身）和照片：``“imgs”：[{“id”：167，“listImg”：“API.url/file/img name.jpg”}]``我的目标是在连接到internet时将照片下载到React应用程序的目录中，这样，当我断开照片连接时，它们将保持保存状态，程序将显示它们。