irpas技术客

vue中后端返回文件流( type: “application/octet-stream“ )的形式,前端进行处理和文件下载,以及自定生成对应的文件类型_@稻草

大大的周 4668

工作中用到,记录一下

前端对于返回数据的处理 1.对于请求的配置 { url: 'xxxx', mothod: 'post', data: params, responseType: 'blob' }

调用接口后返回的结果如下 : Blob(733347) { size: 733347, type: “application/octet-stream” } 2.下载函数 简单说明一下我应用的场景,vue使用ant 框架, 对应的是a-table的操作列下载按钮 这里利用作用域插槽得到每行数据对应的文件名称, 下面的filename就是这样来的,带有相应的后缀 比如: 家电行业报告模板下载.doc 传入两个参数

downfiles ( datas, filename ) { var data = new Blob( [ datas ] ) console.log( data ) var downloadUrl = window.URL.createObjectURL(data) var anchor = document.createElement( 'a' ) anchor.href = downloadUrl // 这里的filename 带有后缀,能决定文件的类型 anchor.downolad = filename anchor.click() window.URL.revokeObjectURL( data ) }

顺利调用,就能下载成功!!!!!


1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,会注明原创字样,如未注明都非原创,如有侵权请联系删除!;3.作者投稿可能会经我们编辑修改或补充;4.本站不提供任何储存功能只提供收集或者投稿人的网盘链接。

标签: #Vue #后台返回文件流 #url #xxxx #mothod #post #data