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

html2Canvas+JsPDF 导出pdf

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

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

解决:将网络图片转成base64

复制代码
<img :src="aaa" style="width:200px" alt="">

转base64
let res = await this.getBase64Image('https://gimg3.baidu.com/search/src=http%3A%2F%2Fpics4.baidu.com%2Ffeed%2F7e3e6709c93d70cf827fb2fda054500cb8a12bc9.jpeg%40f_auto%3Ftoken%3Dd97d3f0fd06e680e592584f8c7a24ac8&refer=http%3A%2F%2Fwww.baidu.com&app=2021&size=f360,240&n=0&g=0n&q=75&fmt=auto?sec=1690045200&t=e1a88c44b1b9907677400a079766e0bf')
this.aaa = res

getBase64Image(src) {
      return new Promise(resolve => {
        const img = new Image()
        img.crossOrigin = ''
        img.src = src
        img.onload = function() {
          const canvas = document.createElement('canvas')
          canvas.width = img.width
          canvas.height = img.height
          const 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)
        }
      })
    },

导出

相关推荐
林枫依依11 小时前
PDF转图片、图片转PDF(免费)
pdf
qq_5469372711 小时前
功能强大的PDF工具箱-- PDF补丁丁,v1.1.0.4657新版本,免费无广告,开箱即用版~
pdf
界面开发小八哥11 小时前
.NET表格控件Spread .NET v18.0——支持富文本、增强PDF导出
信息可视化·pdf·.net·数据可视化·spread .net
明天过后012211 小时前
PDF文件中的相邻页面合并成一页,例如将第1页和第2页合并,第3页和第4页合并
java·python·pdf
爱上纯净的蓝天1 天前
迁移面试题
java·网络·c++·pdf·c#
UtopianCoding1 天前
MinerU:重新定义PDF智能提取的开源利器
docker·pdf·开源
top_designer3 天前
作品集PDF又大又卡?我用InDesign+Acrobat AI构建轻量化交互式文档工作流
人工智能·pdf·自动化·设计规范·acrobat·indesign·交互式pdf
lingliang3 天前
使用 JS 渲染页面并导出为PDF 常见问题与修复
javascript·pdf·vue
WCL-JAVA3 天前
java生成带水印的pdf文件
java·python·pdf
CodeCraft Studio3 天前
PDF 转 TIFF 性能测评:IronPDF具有更快的处理速度、更少的内存
pdf