button按钮 axio实现文件下载 flask后端怎么写
时间: 2024-01-30 10:45:48 浏览: 37
首先,在 Flask 后端中,你需要定义一个路由来处理文件下载请求。在这个路由中,你需要先使用 Axios 向后端发送请求,在获取到文件内容后再将其返回给前端。
下面是一个示例代码:
```python
from flask import Flask, send_file
from io import BytesIO
app = Flask(__name__)
@app.route('/download')
def download_file():
# 获取文件内容
file_content = get_file_content()
# 将文件内容写入 BytesIO 中
mem = BytesIO()
mem.write(file_content)
mem.seek(0)
# 返回文件给前端
return send_file(mem, as_attachment=True, attachment_filename='file.txt')
if __name__ == '__main__':
app.run(debug=True)
```
在上面的代码中,我们定义了一个名为 `/download` 的路由来处理文件下载请求。在这个路由中,我们首先调用 `get_file_content()` 函数来获取文件内容,然后将文件内容写入 BytesIO 中,并使用 `send_file()` 函数将其返回给前端。
在前端中,你可以使用 Axios 来向后端发送文件下载请求:
```javascript
axios({
url: '/download',
method: 'GET',
responseType: 'blob', // 告诉 Axios 返回的数据类型为二进制流
}).then(response => {
const url = window.URL.createObjectURL(new Blob([response.data]));
const link = document.createElement('a');
link.href = url;
link.setAttribute('download', 'file.txt');
document.body.appendChild(link);
link.click();
});
```
在上面的代码中,我们向 `/download` 路由发送了一个 GET 请求,并将 `responseType` 设置为 `blob`,告诉 Axios 返回的数据类型为二进制流。在接收到响应后,我们使用 URL.createObjectURL() 方法将响应数据转换为 Blob URL,并将其赋值给一个 `<a>` 标签的 href 属性。然后创建一个 `<a>` 标签并设置 download 属性来指定下载文件的文件名,最后模拟点击该链接来触发下载操作。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)