微信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商城已停止迭代,目前主研小程序,小程序分享海报问题大家可以交流~~
附上小程序码:
标签:
相关文章
-
无相关信息