如何使用 ReactJS 将文件保存到桌面上？

Question

现在我正在创建一个语音搜索功能。所以计划是我将使用 ReactJS 录制音频，将 Blob 文件转换为 .wav 文件。创建文件后，我会将其保存在本地桌面上。一旦文件位于桌面上，我将使用 python 中的操作系统模块访问桌面上的文件，将音频文件解释为文本。

所以一切基本上都完成了，我遇到的唯一问题是我不知道如何使用 ReactJS 将文件保存在我的桌面上。

有人可以帮我解决这个问题吗？

Answer 1

请参阅web.dev和MDN blob中的更多详细信息

以下代码将起作用。（尝试在 chrome 开发控制台或类似控制台中加载）

const saveFile = async (blob) => {
  const a = document.createElement('a');
  a.download = 'my-file.txt';
  a.href = URL.createObjectURL(blob);
  a.addEventListener('click', (e) => {
    setTimeout(() => URL.revokeObjectURL(a.href), 30 * 1000);
  });
  a.click();
};



const obj = {hello: 'world'};
const blob = new Blob([JSON.stringify(obj, null, 2)], {type : 'application/json'});

saveFile(blob);

// 带有反应

<div onClick={() => saveFile(blob)}> save file </div>