Javascript前端下载后台传来的文件流案例分析?这个问题可能是我们日常学习或工作经常见到的。希望通过这个问题能让你收获颇深。下面是小编给大家带来的参考内容,让我们一起来看看吧!
前台请求数据:
url: & # 39;/app/downloadApp& # 39;, 方法:& # 39;得到# 39; responseType: & # 39;团# 39; 参数:数据
设置接收参数格式为responseType:“团# 39;,
downloadFile (res,文件名){
如果(res) {
返回
}
如果(window.navigator.msSaveBlob) {//IE以及IE内核的浏览器
尝试{
window.navigator。文件名msSaveBlob (res)//res为接口返回数据,这里请求的时候已经处理了,如果没处理需要在此之前自行处理var=https://www.yisu.com/zixun/new Blob数据([res.data])注意这里需要是数组形式的,文件名就是下载之后的文件名//window.navigator。msSaveOrOpenBlob (res,文件名);//此方法类似上面的方法,区别可自行百度
}捕捉(e) {
console.log (e)
}
其他}{
让url=window.URL。createObjectURL(新团((res)))
让链接=document.createElement (' a ')
link.style。显示='没有'
链接。href=url
链接。setAttribute(“下载”,文件名)//文件名
document.body.appendChild(链接)
link.click ()
document.body.removeChild(链接)//下载完成移除元素
window.URL.revokeObjectURL (url)//释放掉团对象
}
}，
下载(){
var data={
appId: this.appId
}
downloadAppAjax(数据)。然后(res=> {
const文件名=decodeURI (res.headers .split(“附加”)(“;”)[1].split (“=? [1]);
console.log(文件名)
this.downloadFile (res.data文件名)
}）
} 这里的downloadAppAjax调用后台接口,请求数据,获取后台返回的数据没有文件名,最后发现在头附加属性里附件;文件名=app.jpg
所以我们要实现下载自动重命名就需要拿出文件名,这里我们使用decodeURI对附加属性值进行解码,拿到文件名:
<代码> decodeURI (res.headers[& # 39;附加# 39;].split (& # 39;; & # 39;) [1] .split(& # 39;=& # 39;)[1]);
拿到文件流和文件名后接收文件流并创建地址
<代码>=window.URL让url。createObjectURL(新Blob ((res)))
接着利用一个标签进行下载即可。
感谢各位的阅读!看完上述内容,你们对Javascript前端下载后台传来的文件流案例分析大概了解了吗?希望文章内容对大家有所帮助。如果想了解更多相关文章内容,欢迎关注行业资讯频道。
