使用到的插件 html2canvas

首先 布局，然后使用html2canvas 生成canvas，使用canvas生成base64，上传到服务器，返回图片地址，进行分享

未标题-3.png

生成的图片需要有个二维码，但是这个二维码不是确定的，所以直接使用html2canvas生成会有跨域问题，本身也不是解决这个问题的，

1546482603542.jpg

注：canvas的 crossOrigin：Anonymous
还有要注意的地方，一定一定先写oImg.crossOrigin = "Anonymous";，在赋值oImg.src，否则会报错。有可能是加载速度太快导致的。
所以转换了一下思路，先使用小canvas生成base64然后进行替换

 var oImg=new Image()
 oImg.crossOrigin = "Anonymous";
 oImg.onload=function(){
        var oCWidht=codeImg.width();
        var oCHeight=codeImg.height();
        oCanvas.width=oCWidht
        oCanvas.height=oCHeight
        var ctx=oCanvas.getContext("2d");
        ctx.drawImage(oImg,0,0,oImg.width,oImg.height,0,0,oCWidht,oCHeight);
        // 替换图片
        var str = oCanvas.toDataURL('image/png')
        codeImg.html(`<img src="${str}">`)
    }
    oImg.src = data_source_100001264.codeLink

这个时候就不会有html2canvas 的跨域问题了，但是会产生新的问题，也就是再次生成的图片会比较模糊。
这个也是一个问题。由于dradImage本身生成的尺寸大小导致的，这个是无法避免的。