dom-to-image 解决图片模糊问题

先去找到dom-to-image的源码，大概在这个位置

然后直接打开搜索 找到draw方法，我们要对他修改一下

将最后一次回调返回canvas的部分方法修改成这样

function (image) {
                var canvas = newCanvas(domNode);
                let context = canvas.getContext('2d');
                const ratio = window.devicePixelRatio || 1;
                canvas.width *= ratio;
                canvas.height *= ratio;
                context.scale(ratio, ratio);
                context.drawImage(image, 0, 0);
                return canvas;
            }

 我认为截取的图片模糊的原因是因为canvas中原来的像素点因为没有与做与物理像素的统一导致其中原本像素点与设备像素产生偏差，在我们改写方法以后用window对象中的devicePixelRatioAPI获取到了当前设备的物理像素与css样式像素的比例，因为在创建newCanvas的时候以及把dom节点传进去所以此时canvas的高和宽就是传入的dom元素的高宽 那只需要再乘以这个ratio比例就能计算出真实的高宽 最后scale应用比例就完美解决了，只是这个情况下截取的图片的尺寸会比传入的dom节点的尺寸有较大尺寸 所以你还需要对截取的img设置一下样式。

一点拙见，说的不对的请指正，也欢迎提出问题。