1500字范文,内容丰富有趣,写作好帮手!
1500字范文 > html2Canvas+JsPDF 导出pdf 无法显示网络图片

html2Canvas+JsPDF 导出pdf 无法显示网络图片

时间:2021-02-22 12:27:46

相关推荐

html2Canvas+JsPDF 导出pdf 无法显示网络图片

html2Canvas+JsPDF 导出pdf

问题:类似于下面着这种网络图片使用img导出的时候是空白的

/search/src=http%3A%2F%%2Ffeed%2F7e3e6709c93d70cf827fb2fda054500cb8a12bc9.jpeg%40f_auto%3Ftoken%3Dd97d3f0fd06e680e592584f8c7a24ac8&refer=http%3A%2F%&app=&size=f360,240&n=0&g=0n&q=75&fmt=auto?sec=1690045200&t=e1a88c44b1b9907677400a079766e0bf

解决:将网络图片转成base64

<img :src="aaa" style="width:200px" alt="">转base64let res = await this.getBase64Image('/search/src=http%3A%2F%%2Ffeed%2F7e3e6709c93d70cf827fb2fda054500cb8a12bc9.jpeg%40f_auto%3Ftoken%3Dd97d3f0fd06e680e592584f8c7a24ac8&refer=http%3A%2F%&app=&size=f360,240&n=0&g=0n&q=75&fmt=auto?sec=1690045200&t=e1a88c44b1b9907677400a079766e0bf')this.aaa = resgetBase64Image(src) {return new Promise(resolve => {const img = new Image()img.crossOrigin = ''img.src = srcimg.onload = function() {const canvas = document.createElement('canvas')canvas.width = img.widthcanvas.height = img.heightconst ctx = canvas.getContext('2d')ctx && ctx.drawImage(img, 0, 0, img.width, img.height)const ext = img.src.substring(img.src.lastIndexOf('.') + 1).toLowerCase()const dataURL = canvas.toDataURL('image/' + ext)resolve(dataURL)}})},

导出

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。