TypeError: Failed to execute ‘createObjectURL‘ on ‘URL‘: Overload resolution failed
作者:小教学发布时间:2023-09-29分类:程序开发学习浏览:82
导读://request.jsservice.interceptors.response.use((response)=>{constres=respo...
//request.js
service.interceptors.response.use(
(response) => {
const res = response.data
// 下载文件
if (!res.code) {
return response
}
...
},
(error) => {
...
}
export function downloadQrcode(params) {
return request({
url: '/multiplayer-draw/download-qrcode',
method: 'get',
// headers: { 'Content-Type': 'image/png; charset=UTF-8' },
responseType: 'blob', // response类型
params
})
}
downloadQrcode({id: this.id}).then(res => {
console.log(res,'res');
var a = document.createElement('a')
document.body.appendChild(a)
a.style = 'display: none'
let url = window.URL.createObjectURL(res);
a.href = url
a.download = '二维码.png'
a.click()
a.remove()
window.URL.revokeObjectURL(url) // 释放url
})
发现报错:
同时,发现接口是有返回值的:
再看打印的res:
发现打印的res并不是最后我们需要的Blob值,我们需要的是Blob类型的值,发现正是res.data(但是从浏览器控制台并不能看出data),所以应该修改request.js为:
const res = response.data
// 下载文件
if (!res.code) {
return response.data //等同于 return res
}
此时发现打印的res为:
也没有“TypeError: Failed to execute ‘createObjectURL’ on ‘URL’: Overload resolution failed”这个报错了,成功下载了图片。
还有第二种方法:创建一个Blob
downloadQrcode({id: this.id}).then(res => {
console.log(res,'res');
var a = document.createElement('a')
document.body.appendChild(a)
a.style = 'display: none'
//增加了下面三行
let blob = new Blob([res], {
type: "image/png",
});
let url = window.URL.createObjectURL(blob);
a.href = url
a.download = '二维码'
a.click()
a.remove()
window.URL.revokeObjectURL(url) // 释放url
})
发现打印的res没变
但是也没有出现“TypeError: Failed to execute ‘createObjectURL’ on ‘URL’: Overload resolution failed”报错,而且a.download = '二维码.png’变成了a.download = ‘二维码’,也成功下载了图片。
- 程序开发学习排行
-
- 1鸿蒙HarmonyOS:Web组件网页白屏检测
- 2HTTPS协议是安全传输,为啥还要再加密?
- 3HarmonyOS鸿蒙应用开发——数据持久化Preferences
- 4记解决MaterialButton背景颜色与设置值不同
- 5鸿蒙HarmonyOS实战-ArkUI组件(RelativeContainer)
- 6鸿蒙HarmonyOS实战-ArkUI组件(Stack)
- 7鸿蒙HarmonyOS实战-ArkUI组件(GridRow/GridCol)
- 8[Android][NDK][Cmake]一文搞懂Android项目中的Cmake
- 9鸿蒙HarmonyOS实战-ArkUI组件(mediaquery)
- 最近发表
-
- WooCommerce最好的WordPress常用插件下载博客插件模块的相关产品
- 羊驼机器人最好的WordPress常用插件下载博客插件模块
- IP信息记录器最好的WordPress常用插件下载博客插件模块
- Linkly for WooCommerce最好的WordPress常用插件下载博客插件模块
- 元素聚合器Forms最好的WordPress常用插件下载博客插件模块
- Promaker Chat 最好的WordPress通用插件下载 博客插件模块
- 自动更新发布日期最好的WordPress常用插件下载博客插件模块
- WordPress官方最好的获取回复WordPress常用插件下载博客插件模块
- Img to rss最好的wordpress常用插件下载博客插件模块
- WPMozo为Elementor最好的WordPress常用插件下载博客插件模块添加精简版