这两天，在处理日志下载功能中，后台接口以二进制流文件的形式传给前端，作为萌新的自己，也是查找了很多资料，进行处理。虽然网上也有很多方法，但真的应用在自己代码上且有效，也真是不容易。下班后，赶紧进行总结，为自己积累经验。

后台传来的流文件，调用接口成功，发现response是这样，原来是后台传的流文件数据，前端需要进行流文件处理，实现压缩文件下载。

调用后台接口，状态200，但是总是不走then代码而跳到catch代码中，肯定是then中存在错误代码，以至于不走then代码。自己当时按照别人的postForm封装axios代码，进行封装get的axisos,结果是多此一举。其实直接用下面的方式就行。

在store.js中

//肯定是有params且params={'fileName:fileName,'filePath:filePath'}
该方法名为wwww
axios

.get(
　　'/eng/downlog?fileName-&(params.fileName)&filePath=&(params.filePath)

) .then(response => { 
　　console.log(response); 
}) .catch(function (error) { 
　　console.log(error); 
});

在xx.vue中downLOg()下载方法

downLOg(fileName,filePath){

let params = {
　　'fileName:fileName,
　　'filePath:filePath'
}
this.$stroe.dispatch('wwww'，params)
.then(response => {
   const blob = new Blob([response]);
   const downloadElement = document.createElement("a");
   const href = window.URL.createObjectURL(blob);
   const name = params.fileName;
   downloadElement.href = href;
   downloadElement.download = name;
   document.body.appendChild(downloadElement);
   downloadElement.click();
   document.body.removeChild(downloadElement);
   window.URL.revokeObjectURL(href);
})
.catch(err => {

})
}

就可以下载日志.zip压缩包文件。

但是下载的压缩包，打不开，提升文件已破损。原来是没有responseType:'blob'。

在store.js中补充结果如下：

.get(
　　'/eng/downlog?fileName-&(params.fileName)&filePath=&(params.filePath),{responseType:'blob'}

) .then(response => { 
　　console.log(response); 
}) .catch(function (error) { 
　　console.log(error); 
});　

再去下载压缩包，发现可以下载，而且可以正常解压。

console.log(res)                     const blob = new Blob([res.data]);                     const downloadElement = document.createElement("a");                     const href = window.URL.createObjectURL(blob);                     //后台再header中传文件名                     const name = fileName;                     downloadElement.href = href;                     downloadElement.download = name;                     document.body.appendChild(downloadElement);                     downloadElement.click();                     document.body.removeChild(downloadElement); // 下载完成移除元素                     window.URL.revokeObjectURL(href); // 释放掉blob对象