React + Node Express，下载的docx文件已损坏

Posted 2021-04-26

我已经阅读了许多类似的问题，尝试了许多建议的解决方案，但没有一个对我有用。因此，我使用“ res.download（'directory /'+ filename）”从后端发送文件，并从响应头判断，我确实获得了正确的文件。我要从中发送的文件夹中没有其他文件，原始文件为14KB。但是，响应的“数据”部分约为21KB。这是我在Web应用程序上的响应以获取文件的方式：

await axios.get(`api` + file.id, 
        {headers: {'x-access-token': token}}, { responseType: 'arraybuffer' }
    ).then((response) => {
        const url = window.URL.createObjectURL(new Blob([response.data])); //specifying the type here doesn't help
        const link = document.createElement('a');
        link.href = url;
        link.setAttribute('download', `${filename}`); //filename = the name of the file i'm trying to download
        document.body.appendChild(link);
        link.click();
        link.parentNode.removeChild(link);
    })

而且我得到的文件也大约为21KB，并且由于损坏而无法用文字打开。

答案

您可能需要像这样在文件名的末尾添加文件扩展名：

 link.setAttribute('download', `${filename}.docx`);

希望这会有所帮助。

另一答案

用axios.get语法弄乱了一点，将“ responseType”与具有标题的配置放在一起。现在我得到的文件没有损坏o_o

axios.get(`api/` + file.id, 
  {
    headers: 
    {
      'x-access-token': token
    },
    responseType: 'arraybuffer' 
  }
)

起初我以为文件大小是不同的，但是没有。所以一定要修复它。这就是我成为js菜鸟后所得到的。