REST API EXPRESS JS:无法在Reactjs中下载文件，该文件由后端发送

Question

我使用 Express JS 创建了 REST API 来发送 Excel 文件：

app.get('/download/', async (req, res) => {
try {
await res.download('./ExcelCopy.xlsx');
} catch (e) {
res.status(400).send(e);
}
});

但是在 Reactjs 中，当我连接到 API 时没有任何反应，但 redux 告诉一切顺利：

export const getExcel = () => async (dispatch) => {
await dispatch(getExcelRequest());
try {
await axios.get('http://127.0.0.1:8888/download/');
dispatch(getExcelSuccess());
} catch (error) {
console.log(error);
dispatch(getExcelFailed());
}
};

我应该怎么做才能使用 react js 从后端下载文件

Answer 1

您需要添加response type并使用 npm 包文件保护程序下载文件。

修改后的代码：

export const getExcel = () => async (dispatch) => {
await dispatch(getExcelRequest());
try {
axios.get('http://127.0.0.1:8888/download/', { responseType: 'arraybuffer' })
.then((response) => {
var blob = new Blob([response.data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
fileSaver.saveAs(blob, 'data.xlsx');
dispatch(getExcelSuccess());
});        
} catch (error) {
console.log(error);
dispatch(getExcelFailed());
}
};

Answer 2

据我所知，您不能只发送获取请求来下载文件。相反，我建议您使用名为js-file-download的模块。

用法示例：

const FileDownload = require('js-file-download');
const response = await axios.get('http://127.0.0.1:8888/download/')
FileDownload(response.data, 'ExcelCopy.xlsx');

希望对您有所帮助。