截屏转base64 调用栈

房产经纪人页面错误信息采集方案 https://mp.weixin.qq.com/s/tznlHs3XRwJFQtGiCwp15w

function captureScreen() {

    var targetDom = document.querySelector("body");

    html2canvas(targetDom, {

        useCORS: true,

        allowTaint: false  

        height: targetDom.scrollHeight,

        width: targetDom.scrollWidth,

    }).then(function (canvas) {

        var context = canvas.getContext('2d');

        context.mozImageSmoothingEnabled = false;

        context.webkitImageSmoothingEnabled = false;

        context.msImageSmoothingEnabled = false;

        context.imageSmoothingEnabled = false;

        var quality = 0.92;

        var base64Image = canvas.toDataURL('image/png', quality).substring(22);

        ErrorDetector.accidentScene.img = base64Image;

    })

} 

 

但问题还是要查下去。通过上报上来的错误日志拿到了错误类型及调用栈（stack trace）信息，也定位到了报错文件及代码块，报错是从基础UI库里报出来的。但由于调用栈太深，之前也没有考虑到用Error.stackTraceLimit参数来调大error栈帧数， stack trace默认只有10行，能拿到的错误信息又太过于底层，无法有效定位异常根源。因为对于底层方法而言，外层调用入口很多，没有足够的调用链信息就无法确定异常调用来源，原本一向无敌的stack trace，那刻却变得非常鸡肋。至于如何拿到混淆代码stack trace里的原始内容，请参见https://github.com/mozilla/source-map，这里不做过多说明。