前端下载文件无法打开

在开发过程中遇到下载功能，后端直接从服务器拉文件是可以打开的，前端通过接口下载的文件打开报错，如下：，是前端的响应头配置错误。

代码如下：

// 下载接口配置
export const download = (params) => {
  return request({
    url:'/file/download',
    method:'get',
    responseType: 'arraybuffer', // 配置响应头，不配置的话会造成，文件下载下来了，但是“无法打开”
    params: params
  })
}
// 接口调用
methods: {
	// 下载方法
	handleDownload (fileInfo) {
      download({
        id: fileInfo.id
      }).then(res => {
        const element = document.createElement('a');
        element.setAttribute('download', fileInfo.name);
        let binaryData = [];
        binaryData.push(res.data); // 返回文件流 如下图
        element.setAttribute('href', window.URL.createObjectURL(new Blob(binaryData)));
        document.body.appendChild(element);
        element.click();
        document.body.removeChild(element);
      })
    },
}

后端返回举例：