将 React Web 应用程序中的图像保存到我的笔记本电脑

【问题标题】：Save image from react web app to my laptop将 React Web 应用程序中的图像保存到我的笔记本电脑
【发布时间】：2020-10-22 15:25:36
【问题描述】：

我正在尝试通过单击“保存”按钮并通过以下方式保存我的图像来了解如何保存我的 react Web 应用程序上显示的图像：

到我笔记本电脑上的下载文件夹或
弹出 Windows 资源管理器并确定文件名和图像的保存位置

我的应用的屏幕截图：

【问题讨论】：

标签： javascript node.js reactjs savefiledialog

【解决方案1】：

您需要创建该图像的 blob，然后创建一个锚标记并触发包含该 blob 网址的下载响应。

看到这个。 Download image in ReactJS

【讨论】：

【解决方案2】：

npm install --save image-downloader

用于从给定 URL 将图像下载到磁盘的 Node 模块

例子：-

const download = require('image-downloader')
 
options = {
  url: 'http://someurl.com/image2.jpg',
  dest: '/path/to/dest/photo.jpg'      // will be saved to /path/to/dest/photo.jpg
}
 
download.image(options)
  .then(({ filename }) => {
    console.log('Saved to', filename)  // saved to /path/to/dest/photo.jpg
  })
  .catch((err) => console.error(err))

【讨论】：