canvas在APICloud上面实现页面截图功能

最新推荐文章于 2023-03-16 17:12:36 发布

qq_40928217

最新推荐文章于 2023-03-16 17:12:36 发布

阅读量293

点赞数

分类专栏： APICloud

本文链接：https://blog.csdn.net/qq_40928217/article/details/109741625

版权

在APICloud开发中，由于加密打包可能导致图片无法显示。为解决这一问题，可以通过先下载图片到本地，随后将本地图片渲染到页面上进行截图的操作。

摘要由CSDN通过智能技术生成

注意元素不能使用盒模型，cavans不认识。

<div id="canvas">
    <img crossOrigin="anonymous"  alt="" src="https://community.apicloud.com/bbs/template/hl_iuni/images/logo-dark.png">
</div>

"html2canvas": "^1.0.0-rc.7",

canvas(callback){
              html2canvas(document.getElementById("canvas"), {scale:2,logging:false,useCORS:true}).then((canvas)=> {
                  var dataUrl = canvas.toDataURL();  //获取base64图片
                  var trans = api.require('trans');
                  var imgName = NewGuid() + ".jpg";
                  trans.saveImage({
                      base64Str: dataUrl.slice(22),  //处理base64，不处理会闪退
                      imgPath:"fs://",
                      album:true,  //是否需要保存到相册