微信H5 html2canvas截图在IOS13.4失效问题

微信H5商城持续维护,上周终于把团购搞完并顺利上线了。
还记此前使用html2canvas生成分享图,也时不时的出现bug,本周商城很多用户反馈:分享图生成不了!!!
由于团购上线紧急,反馈用户也比较少,这个问题便稍稍搁置了,团购搞完了,这个问题也该提上议程了。

分析问题:

从用户处了解到全是IOS问题,找了半天没发现问题所在,加上公司同事手机都是Iphone,也都可以正常截图啊,无任何问题!!!

看了看自己手机版本13.3.4,设置也有提示更新13.4.1,好家伙那更新下系统,再一探究竟,同时问了下出现问题的用户手机系统版本,竟然也是13.4.1,ok,那问题所在点基本是确定了,接下来就解决问题!

解决问题:

打开微信调试助手,连接手机进行移动端调试,点击分享图,静待出现报错原因,嘿嘿
我擦勒,竟然没报错!!!没有任何问题,可就是不能生成图片!看来还得继续寻找问题了。。。

既然用的html2canvas插件,那咱们就去官方瞅瞅呢
果然,在官方issues还真有提关于微信H5不能生成图片的问题,最终找到问题如下:
Promise documentClone.fonts.ready not resolve in file document-cloner.ts
也就是说当前版本中已不存在这部分代码了
使用上个版本即可解决问题!

附上issue链接地址: https://github.com/niklasvh/html2canvas/issues/2205

最新版本:“html2canvas”: “1.0.0-rc.5” (×)
上一版本:“html2canvas”: “1.0.0-rc.4” (√)

切换版本,真机测试,完美解决!nice

总结:

遇到问题不要方,咱一步一步来,特别是前端兼容性问题,指不定前面会有什么问题等着你,只要心态放稳,分析问题、锁定问题、解决问题三步走,就一定能完美解决!
最后:干就完了!

本人撸的H5项目,看效果的可以参考:(仅微信内访问)
日本跨境电商 :http://h5mall.beautyclass.shop/home?channel=h5mall&uid=5

H5商城已停止迭代,目前主研小程序,小程序分享海报问题大家可以交流~~
附上小程序码:
在这里插入图片描述

  • 8
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 25
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 25
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值