9***@qq.com
9***@qq.com
  • 发布:2019-10-09 14:53
  • 更新:2019-10-15 17:33
  • 阅读:1852

canvas.toDataURL('image/png') 导致APP崩溃

分类:HBuilderX

详细问题描述

(DCloud产品不会有明显的bug,所以你遇到的问题大都是在特定环境下才能重现的问题,请仔细描述你的环境和重现方式,否则DCloud很难排查解决你的问题)

[内容]你好,我使用 canvasD.toDataURL('image/png') APP安卓APP崩溃 是什么原因,我的操作流程是从本地相册选择图片或者拍照获取图片,然后对图片打水印了,转成base64的时候老崩溃啊,图片宽高是 1440X2560 了,以前的版本我记得不崩溃,最近更新了 HbuilderX就崩溃了,HbuilderX MAC版版本是 2.3.3.20190923

重现步骤

[步骤]

[结果]

[期望]

[如果语言难以表述清晰,拍一个视频或截图,有图有真相]

IDE运行环境说明

[HBuilder 或 HBuilderX。如果你用其他工具开发uni-app,也需要在此说明]

[IDE版本号]

[windows版本号]

[mac版本号]

uni-app运行环境说明

[运行端是h5或app或某个小程序?]

[运行端版本号]

[项目是cli创建的还是HBuilderX创建的?如果是cli创建的,请更新到最新版cli再试]

[编译模式是老模板模式还是新的自定义组件模式?]

App运行环境说明

[Android版本号]

[iOS版本号]

[手机型号]

[模拟器型号]

附件

[IDE问题请提供HBuilderX运行日志。菜单帮助-查看运行日志,点右键打开文件所在目录,将log文件压缩成zip包上传]

[App问题请提供可重现问题的代码片段,你补充的细一点,问题就解决的快一点]

[App安装包或H5地址]

[可重现代码片段]

联系方式

[QQ]

2019-10-09 14:53 负责人:无 分享
已邀请:
DCloud_heavensoft

DCloud_heavensoft

应该是内存不足导致崩溃,估计是以前的手机像素不够高吧。
这种webview内部api,不会随着HBuilderX升级而变化。但手机是可以升级webview的

  • 手写的从前

    我也遇到了这个问题,不是内存不足,我回退到上个版本就没问题,一更新 就不行了 提示 “_downloads/Unknown”

    2019-10-14 20:59

  • 手写的从前

    希望能解决一下

    2019-10-14 20:59

  • 手写的从前

    2.3.2 一点问题都没

    2019-10-14 21:00

1***@qq.com

1***@qq.com

所有人 所有ios 手机这个都不行

9***@qq.com

9***@qq.com (作者)

我的解决了,是图片太大的原因,我的图片都以800X800进行缩放就行了,然后图片转成jpeg类型的就好了

9***@qq.com

9***@qq.com (作者)

var image = new Image();
//image.setAttribute('crossOrigin', 'anonymous');
//image.crossOrigin="anonymous"; //关键
image.src = fileSrc;
plus.nativeUI.showWaiting('打水印中');

                image.onload = function() {  
                    //var canvasD = document.getElementById('photo8888');  
                    var canvasD = document.createElement('canvas');  
                    console.log("加载水印");  
                    console.log(this.width + '####' + this.height);  
                    var originWidth = this.width;  
                    var originHeight = this.height;  
                    // 最大尺寸限制,可通过国设置宽高来实现图片压缩程度  
                    var maxWidth = 800;  
                    var maxHeight = 800;  
                    // 目标尺寸  
                    var targetWidth = originWidth;  
                    var targetHeight = originHeight;  
                    // 图片尺寸超过400x400的限制  
                    if (originWidth > maxWidth || originHeight > maxHeight) {  
                        if (originWidth / originHeight > maxWidth / maxHeight) {  
                            // 更宽,按照宽度限定尺寸  
                            targetWidth = maxWidth;  
                            targetHeight = Math.round(maxWidth * (originHeight / originWidth));  
                        } else {  
                            targetHeight = maxHeight;  
                            targetWidth = Math.round(maxHeight * (originWidth / originHeight));  
                        }  
                    }  
                    console.log(targetWidth + '####' + targetHeight);  

                    canvasD.width = targetWidth;  
                    canvasD.height = targetHeight;  
                    var ctx = canvasD.getContext("2d");  
                    //ctx.clearRect(0, 0, targetWidth, targetHeight);  
                    ctx.drawImage(this, 0, 0, canvasD.width, canvasD.height);  
                    //绘制水印  
                    // ctx.font = "bolder 32px microsoft yahei";  
                    ctx.font = "bold 20px Arial"  
                    ctx.fillStyle = "rgba(254,61,55,1)";  
                    var lineHeight = 32;  
                    var chaCount = 10;  
                    var starHeight = 40;  
                    var totalHeight = targetHeight - 5;  

                    var hang = 0;  
                    var len = parseInt(targetWidth * 24 / 694) * 2;  
                    var canLen = len * 2;  
                    console.log('一行的文字数量:' + len);  

                    if (dataShuiyin.address) {  
                        if (dataShuiyin.address.length > len) {  
                            hang = 1;  
                        } else {  
                            hang = 0;  
                        }  

                        writeTextOnCanvas(ctx, lineHeight, canLen, dataShuiyin.address, 2, totalHeight - hang * lineHeight);  

                    }  
                    //ctx.fillText(dataShuiyin.address,2,totalHeight - hang * lineHeight)   ;             

                    //经纬度  
                    ctx.fillText(dataShuiyin.longlat, 2, totalHeight - (hang + 1) * lineHeight);  

                    //营业厅  
                    ctx.fillText(dataShuiyin.yingValue, 2, totalHeight - (hang + 2) * lineHeight);  

                    //终端编号  
                    ctx.fillText(dataShuiyin.temalValue, 2, totalHeight - (hang + 3) * lineHeight);  

                    //console.log('4**' + canvasD.toDataURL('image/jpeg', 0.92));  

                    cover.attr('src', canvasD.toDataURL('image/jpeg', 0.92));  

                }
9***@qq.com

9***@qq.com (作者)

代码贴出来,大家参考下

该问题目前已经被锁定, 无法添加新回复