首页 > 编程语言 > 详细

vue+python实现后台数据excel导出

时间:2021-09-04 02:59:53      阅读:10      评论:0      收藏:0      [点我收藏+]

废话不多直接上代码

后端代码:

@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"。

不同的方法这里的格式也不一样。

vue+python实现后台数据excel导出

原文:https://www.cnblogs.com/DarkRoger/p/15222962.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!