如何修复 html2canvas 库中的错误

Question

I was using html2canvas to convert an image in base 64 and send it through PHP and thus store it as a Blob, at first it worked correctly and when I decoded it it showed me the image, but now it shows me this error in the library and I don't know why it happens.

The error is the following:

 documentClone.replaceChild(documentClone.adoptNode(cloner.documentElement), documentClone.documentElement);

When I execute the event to take the capture of my html, I get an error in the library code, and my code sends me a base64 image but it does not exist, because the library did not take any capture of my html.

This is my javascript with which I send the image in base64

 html2canvas(document.body).then(function (canvas){ var ajax = new XMLHttpRequest(); var num = Math.floor(Math.random()*10000); ajax.open("POST", "save-any.php", true); ajax.setRequestHeader("Content-type", "application/x-www-form-urlencoded") ajax.send("num=" + num + "&image=" + canvas.toDataURL("image/jpeg", 0.9)); }); }

What happens to me is that the library does not save me any image but it generates a url that does not lead to any image.

Answer 1

This error indicates that document.body is probably undefined. Use chrome Deb tools and put a break on html2canvas(document.body).then(function and inspect value of document.body.

I have also seen this error when the element sent to html2canvas is not a single element/node but rather an array of nodes.