将数据以文件的形式保存在react的UI中

Question

我正在从 API 读取数据并下载 file。我想在 react 应用程序的 public 文件夹中保存相同的 file。

 this.state = {
      fileDownloadUrl: null,
      fileName: '',
    };

方法如下

 downLoadFile(e) {
    e.preventDefault();
    axios
      .get(
        'http://localhost:8080/file_download/en'
      )
      .then((res) => {
       var output = res.data;
        const blob = new Blob([output]);
        const fileDownloadUrl = URL.createObjectURL(blob);
        this.setState({ fileDownloadUrl: fileDownloadUrl }, () => {
          this.dofileDownload.click();
          URL.revokeObjectURL(fileDownloadUrl);
          this.setState({ fileDownloadUrl: '' });
        });
      });
  }

下载文件的代码。

           <a
            className="hidden"
            download={this.state.fileName + '.json'}
            href={this.state.fileDownloadUrl}
            ref={(e) => (this.dofileDownload = e)}
          >
            download it
          </a>

我是否可以修改 code 以便 file 可以保存在 react 应用程序的 public 文件夹中。稍后将使用此文件进行翻译。

Answer 1

这是不可能的，因为这会带来安全风险。

大多数OS会默认下载到下载文件夹。

Pure browser-JavaScript 无法获取有关用户文件系统的信息。默认下载路径也可能包含敏感信息，这是有风险的。

Answer 2

无法通过浏览器中的前端应用运行自动下载文件并将其保存在硬盘上的特定位置。您应用的用户将根据他们的浏览器设置决定文件的保存方式。

如果你想达到那种目的，那就错了，你应该考虑另一种方法。

将数据以文件的形式保存在react的UI中

Save the data in the UI of react in the form of file

javascript

reactjs

react-native

react-redux

react-hooks