export function convertRes2Blob(response,exportFileName) { // try { const fileName = response.headers['content-disposition']?.match(/filename=(.*)/)[1] ?? exportFileName // 将二进制流转为blob const blob = new Blob([response.data], { type: 'application/octet-stream' }) if (typeof window.navigator.msSaveBlob !== 'undefined') { // 兼容IE,window.navigator.msSaveBlob:以本地方式保存文件 window.navigator.msSaveBlob(blob, decodeURI(fileName)) } else { // 创建新的URL并指向File对象或者Blob对象的地址 const blobURL = window.URL.createObjectURL(blob) // 创建a标签,用于跳转至下载链接 const tempLink = document.createElement('a') tempLink.style.display = 'none' tempLink.href = blobURL tempLink.setAttribute('download', decodeURI(fileName)) // 兼容:某些浏览器不支持HTML5的download属性 if (typeof tempLink.download === 'undefined') { tempLink.setAttribute('target', '_blank') } // 挂载a标签 document.body.appendChild(tempLink) tempLink.click() document.body.removeChild(tempLink) // 释放blob URL地址 window.URL.revokeObjectURL(blobURL) } message.success("已导出"); // } // catch (error) { // message.warning("导出异常,请重新尝试"); // } } 导出报Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'content-disposition'是因为什么原因
时间: 2024-02-14 12:07:31 浏览: 147
这个错误通常是因为响应头中不存在 "content-disposition" 属性。在你的代码中,你尝试使用 response.headers['content-disposition'] 获取文件名,然而如果响应头中没有这个属性,则会返回 undefined,导致你在尝试使用 undefined.match(/filename=(.*)/)[1] 访问一个不存在的属性,从而导致这个错误。
为了避免这个问题,你可以在读取 response.headers['content-disposition'] 之前先检查一下这个属性是否存在,例如:
```
const fileName = (response.headers['content-disposition'] && response.headers['content-disposition'].match(/filename=(.*)/)[1]) || exportFileName;
```
这样,如果响应头中不存在 "content-disposition" 属性,fileName 将会默认使用传入的 exportFileName。
相关问题
exportZip(url, params, type = '.zip', fileName) { return axios({ url, data: params, method: 'post', headers: { 'X-Requested-With': 'XMLHttpRequest', 'Authorization': sessionStorage.getItem('token'), 'Content-Type': 'application/json' }, responseType: 'blob' }).then(checkStatus).then(response => { const blob = new Blob([response.data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8' }); const downloadElement = document.createElement('a'); const href = window.URL.createObjectURL(blob); let name = ""; if (fileName) { name = fileName; } else { const contentDisposition = response.headers['content-disposition']; if (contentDisposition) { const filenameMatch = contentDisposition.match(/filename\*?=['"]?(?:UTF-\d['"]*)?([^;\r\n"']*)['"]?;?/); if (filenameMatch && filenameMatch.length > 1) { name = decodeURIComponent(filenameMatch[1]); } } } if (!name) { name = new Date().getTime().toString(); } downloadElement.href = href; downloadElement.download = name ; document.body.appendChild(downloadElement); downloadElement.click(); document.body.removeChild(downloadElement); window.URL.revokeObjectURL(href); return { code: 200 }; }); },
这段代码是一个函数`exportZip`,它用于导出一个zip文件。函数接受四个参数,`url`表示请求的URL地址,`params`表示请求的参数,`type`表示文件类型,默认是'.zip',`fileName`表示文件名。
函数使用axios库发送POST请求,并设置了请求头部信息,包括'X-Requested-With'、'Authorization'和'Content-Type'。同时设置了响应类型为blob。
在请求成功后,将响应数据转为Blob对象,创建一个下载链接,并设置下载链接的属性。如果传入了`fileName`参数,则使用该参数作为文件名;否则解析响应头部的'content-disposition'字段获取文件名。
如果无法获取文件名,则使用当前时间的时间戳作为文件名。
最后将下载链接添加到页面中,模拟点击下载链接,完成文件下载操作。
函数最后返回一个包含状态码200的对象。
请注意,这段代码中使用了一些浏览器相关的API,所以需要在浏览器环境下运行。
阅读全文