标签：vue const python excel filename headers link blob response

废话不多直接上代码

后端代码：

@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,const,python,excel,filename,headers,link,blob,response
来源： https://www.cnblogs.com/DarkRoger/p/15222962.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。