html2canvas 截图空白 或出现toDataURL‘ on ‘HTMLCanvasElement或img标签没截下来 的所有解决办法

1.如果截图空白:在这里插入图片描述

1.1以下的参数是必须要有的。

							width: shareContent.offsetWidth, //设置canvas尺寸与所截图尺寸相同,防止白边
							height: shareContent.offsetHeight, //防止白边
							logging: true,
							useCORS: true,
							x:0,
							y:0,

2,如果出现了报错 toDataURL’ on 'HTMLCanvasElement 这个报错 那么我的解决办法就是加参数 就解决了:

2.1这两个是解决这个报错的

foreignObjectRendering : true,
allowTaint :true

3.如果你截图的内容包含了图片 但是你截图上没显示 那么你就需要以下的操作。

3.1先设置上这个参数

useCORS: true, 

3.2必须在img标签上加上这个参数

<img crossOrigin="anonymous" :src="wx64Url" alt="img"></img>

3.3最重要的一步就是必须把你的图片路径变成base64格式的,不管是网络图片还是本地图片 都不管用 必须是base64格式的, 转成了base64格式会截图很慢,所以你截图的时候必须加上一个定时器,如上图1

如果需要我的完整代码的话 可以关注我私聊。我会给你发完整的代码。只是关于截图的部分

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值