怎么写前后端分离异步导出
时间: 2023-11-11 22:03:39 浏览: 38
前后端分离异步导出通常涉及以下步骤:
1. 前端通过 API 请求后端的导出接口。
2. 后端接收到请求后,开启一个异步任务,生成导出文件,并将文件存储到服务器的某个目录下。
3. 后端返回一个任务 ID 给前端,表示任务已经在后台运行,可以通过该任务 ID 查询任务的执行状态和导出结果。
4. 前端通过轮询或 WebSocket 等方式定时查询任务状态,直到任务完成。
5. 当任务完成后,前端再次通过 API 请求后端获取导出文件的下载链接,并将其提供给用户进行下载。
下面是一个简单的示例代码,使用 Node.js 和 Express 实现后端的异步导出功能:
```javascript
// 后端路由:异步导出接口
app.get('/api/export', async (req, res) => {
// 生成任务 ID
const taskId = uuid.v4();
// 开启异步任务
const task = async () => {
// 生成导出文件
const filename = `export-${taskId}.csv`;
await generateExportFile(filename);
// 将文件路径保存到任务状态中
const taskStatus = { status: 'completed', file: filename };
taskStatusMap.set(taskId, taskStatus);
};
task();
// 返回任务 ID 给前端
res.json({ taskId });
});
// 后端路由:查询任务状态接口
app.get('/api/export/status/:taskId', async (req, res) => {
const { taskId } = req.params;
const taskStatus = taskStatusMap.get(taskId);
res.json(taskStatus || { status: 'not-found' });
});
// 后端路由:获取导出文件下载链接接口
app.get('/api/export/download/:taskId', async (req, res) => {
const { taskId } = req.params;
const taskStatus = taskStatusMap.get(taskId);
if (!taskStatus || taskStatus.status !== 'completed') {
res.status(404).send('File not found');
return;
}
const { file } = taskStatus;
const filePath = path.join(__dirname, 'exports', file);
res.download(filePath, file, (err) => {
if (err) {
console.error(`Error downloading file: ${err}`);
} else {
console.log(`File downloaded: ${filePath}`);
}
});
});
```
在上面的代码中,我们使用了一个 Map 对象来保存每个任务的状态,包括任务的执行状态和导出文件的路径。当前端请求导出接口时,后端会生成一个随机的任务 ID,并返回给前端。后端会开启一个异步任务,在任务完成后将文件路径保存到任务状态中。前端可以通过任务 ID 定时查询任务状态,直到任务完成后再请求下载链接,下载导出文件。