niklasvh / html2canvas

Screenshots with JavaScript
https://html2canvas.hertzen.com/
MIT License
30.42k stars 4.79k forks source link

html2canvas does not render images located in the element #722

Closed ghost closed 7 years ago

ghost commented 8 years ago

Let's say if I would add text and a background color, then I'd press save, it would show the text and background color, but if I add an image into the div it won't show the image, but still the other things.

Muskan-Redaptive commented 8 months ago

guys, try this for aws s3 images

Tried and it worked for me when added crossOrigin="anonymous" to the img tag. with html2canvas(input, { logging: true, allowTaint: true, useCORS: true, }).then((canvas) => {});

Thank you!

MartinMorici commented 7 months ago

guys, try this for aws s3 images

Tried and it worked for me when added crossOrigin="anonymous" to the img tag. with html2canvas(input, { logging: true, allowTaint: true, useCORS: true, }).then((canvas) => {});

Thank you!

It worked! Thank you 👍

silpareddy1268 commented 7 months ago

same problem.... and my images are coming from same orign

I just fixed this problem. pls enable the option 'useCORS' to 'true' codes bellow: html2canvas( document.querySelector(".preview_area"), { logging: true, letterRendering: 1, // allowTaint: false useCORS: true } ).then(canvas => { })

It works. Thank you

mattscotty commented 7 months ago

Did anyone get this working for local / same domain images? I'm on 1.4.1 with useCORS:true and no images get rendered either as a background image or img element. I don't get any errors.

udaraliyanage96cs commented 4 months ago

me too

Did anyone get this working for local / same domain images? I'm on 1.4.1 with useCORS:true and no images get rendered either as a background image or img element. I don't get any errors.

mattscotty commented 4 months ago

me too

Did anyone get this working for local / same domain images? I'm on 1.4.1 with useCORS:true and no images get rendered either as a background image or img element. I don't get any errors.

I went with https://github.com/qq15725/modern-screenshot in the end, still not perfect but worked better for this use case

SalahAdDin commented 4 months ago

me too

Did anyone get this working for local/same domain images? I'm on 1.4.1 with useCORS: true and no images get rendered either as a background image or img element. I don't get any errors.

I went with https://github.com/qq15725/modern-screenshot in the end, still not perfect but worked better for this use case

Looks nice!

GabrielNM12 commented 3 weeks ago

The "img" tag wouldn't render in any means when using html2canvas in my project, the way that I fixed was by putting the image as a background-image in a "div" tag, this way the image finally got rendered in the final object, would suggest give this approach a try