blob类型的图片转换成base64格式时的错误

发布于 2022-09-06 15:01:43 字数 642 浏览 13 评论 0

我的项目使用的是element-ui和vue.js搭配做的前端,element-ui的上传图片插件提取的图片文件是这种格式:blob:http://administer.abc.local/ea15d81d-3704-4e49-8c93-971336e8f08d

我百度了一下把它转成base64编码传给后台的方法,并且照着写:

let data;
let blob = 'blob:http://administer.abc.local/ea15d81d-3704-4e49-8c93-971336e8f08d'
let reader = new window.FileReader();
reader.readAsDataURL(blob);
reader.onloadend = function() {
    data = reader.result;
    console.log(data);
}

但是报了这个错误:

clipboard.png

求大佬帮看看哪里出了问题?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

荒人说梦 2022-09-13 15:01:43

你的blob是个字符串。
拿走,不谢。直接运行以下代码会报跨域,你换个你同域地址。或者装个浏览器跨域插件

fetch(`https://static.segmentfault.com/v-5a7c12fe/global/img/logo-b.svg`).then(data=>{
    const blob = data.blob();
    return blob;
}).then(blob=>{
    let reader = new window.FileReader();
    
    reader.onloadend = function() {
        const data = reader.result;
        console.log(data);
    };

    reader.readAsDataURL(blob);
})

clipboard.png

恏ㄋ傷疤忘ㄋ疼 2022-09-13 15:01:43

这不是写了吗?参数第一个不是blob

无所谓啦 2022-09-13 15:01:43
let blob = 'blob:http://administer.abc.local/ea15d81d-3704-4e49-8c93-971336e8f08d'

你这样写blob是个String类型了,不是Blob类型

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文