我正在使用这种方法从服务器下载pdf文件(laravel 8(api sanctum)+ vue 3)
在vue组件中,我有这个函数来下载文件
const onDownloadDocument = (id) => {
axios.post('/api/document/download', {id: id},{
responseType: 'blob'
}).then(response => {
let filename = response.headers['content-disposition'].split('filename=')[1]
dLink.value.href = window.URL.createObjectURL(response.data)
dLink.value.setAttribute('download',filename)
dLink.value.click()
}).catch(error => {
console.log(error)
})
其中dLink是一个链接引用
const dLink = ref(null)
在模板中:
<a ref="dLink"/>
直到今天这种方法一直奏效...... 在我更新了项目(composer update和npm update)之后
现在当我点击下载文件(调用onDownloadDocument函数)时,会出现错误:
contract.js:1049 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'responseType')
有什么想法吗?
API后端返回文件blob。
return Storage::download($document->filename);
contract.js:1049
是什么?堆栈跟踪将准确告诉您哪一段代码导致了问题。 - miken32if (error.request.responseType === 'blob' && error.response.data instanceof Blob && error.response.data.type && error.response.data.type.toLowerCase().indexOf('json') !== -1)
.... 现在我已经注释掉了所有的 catch 错误代码,只设置了 console.log(error),然后得到了TypeError: Cannot set properties of null (setting 'href')
的错误提示,它指向这一行代码dLink.value.href = window.URL.createObjectURL(response.data);
。 - calin24