vue element中axios下载文件(后端Python)
•axios接受文件流,需要设置{responseType:'arraybuffer'}
axios.post( apiUrl, formdata, {responseType:'arraybuffer'} ).then(res=>{ if(res.status===200){ letblob=newBlob([res.data],{ type:res.headers['content-type'] }); constfileName=res.headers['content-disposition']; consttitle=fileName&&(fileName.indexOf('filename=')!==-1)?fileName.split('=')[1]:'download'; require('script-loader!file-saver'); saveAs(blob,title); } }) .catch();
注:axios中response表示服务器响应的数据类型,可以是arraybuffer,blob,document,json,text,stream.默认为:json
•后端发送文件:Python
fromflaskimportsend_from_directory @admin_bp.route('/tasksothers/download',methods=["GET","POST"]) @auth.login_required defapi_tasksothers_download(): root_path='' src_name="a.sql" upload_path=os.path.join(root_path,src_name) print("upload_path=",upload_path) ifos.path.isfile(upload_path): response=send_from_directory(root_path,src_name,as_attachment=True) print("response:",response) response.headers["Access-Control-Expose-Headers"]="Content-disposition" print("response:",response.headers) returnresponse
注:如果response.header中没有添加 Access-Control-Expose-Headers这个参数(代表:服务器允许浏览器访问的头(headers)的白名单),vue中就无法获取content-disposition,即res.headers['content-disposition'];无法找到
总结
以上所述是小编给大家给大家介绍的vueelement中axios下载文件(后端Python),希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!
声明:本文内容来源于网络,版权归原作者所有,内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎发送邮件至:czq8825#qq.com(发邮件时,请将#更换为@)进行举报,并提供相关证据,一经查实,本站将立刻删除涉嫌侵权内容。