html2canvas截图丢失部分元素

Question

html2canvas截图丢失所选区域的部分元素

//这是我需要截取的元素

中...]

//截取之后，图中会丢失一些模块

请问有哪位道友遇到过类似的问题？？？

相关代码

let targetDom = $('#outerLayoutPC');
let copyDom = targetDom.clone();
copyDom.width(targetDom.width() + 'px');
copyDom.height(targetDom.height() + 'px');
$('body').append(copyDom);
html2canvas(targetDom, {
    // allowTaint: true,
    taintTest: false,
    userCORS: true,
    onrendered: function (canvas) {
        document.body.appendChild(canvas);
        const Context = AuthToken.getICOPContext();
        canvas.id = 'mycanvas';
        //生成base64图片数据
        const dataUrl = canvas.toDataURL('image/png');
        //将base64图片数据转换为文件形式
        const file = dataURLtoFile(dataUrl, `${title}.png`);
        //声明FormData对象
        const formData = new FormData();
        //给FormData对象添加参数
        formData.append('files', file);
        formData.append('relationId', relationId);
        //添加请求的认证信息 -- 认证信息加到headers中
        const authority = `companyName=${encodeURI(Context.companyName)};_A_P_userLoginName=${Context._A_P_userLoginName};u_usercode=${Context.u_usercode};tenantid=${Context.tenantid};companyCode=${Context.companyCode};u_logints=${Context.u_logints};userId=${Context.userId};_A_P_userName=${encodeURI(Context._A_P_userName)};token=${Context.token};companyId=${Context.companyId};userType=${Context.userType}`;
        //发送上传图片请求
        $.ajax({
            url: LayoutUrl.UPLOAD_IMG,
            type: 'post',
            headers: {
                'icop-token': Context.token,
                'authority': authority
            },
            contentType: false, //必不可少
            processData: false, //必不可少
            data: formData//这里包括了所有表单的数据
        }).done(function (result) {
            // $('.layoutCardPage').parent().css({
            //     overflow: 'auto'
            // });
            $('body>.outerLayoutPC').remove();
            resolve();
        });
    }
});

Answer 1

我猜图片跨域了。
图片不能跨域，不然html2canvas就获取不到图片的base64。

Answer 2

html2canvas图片不能跨域 得做跨域处理