废话不多直接上代码
后端代码:
@app.route('/api/user/logindownloadTemplate',methods=['get']) def downloadTemplate(): try : response = make_response(send_file('./static/file/templates/1.xlsx',as_attachment=True)) response.headers["Access-Control-Expose-Headers"] = "Content-disposition" return response
本人后台使用的flask所以直接flask自带的文件返回文件,这里需要注意设置response的headers,不然会出现编码问题。
这样的文件是文件流,到了前端不能直接下载所以前端需要处理以下
前端代码:
handleDownload() { this.$axios .get("/api/user/logindownloadTemplate", { responseType: "blob" }) .then((response) => { if (response.status === 200) { const filename = response.headers["content-disposition"] .split("filename=")[1] .split("; filename")[0]; const url = window.URL.createObjectURL(response.data); const link = document.createElement("a"); link.style.display = "none"; link.href = url; link.setAttribute("download", "导出" + filename); document.body.appendChild(link); link.click(); } }) .catch(); },
这里是将文件流转为blob格式,然后前端做处理下载下来。当然方法有很多,我这里就用隐藏的a链接下载。注意,请求一定要设置responseType: "blob"。
不同的方法这里的格式也不一样。