I am using use-screen-shot to take screenshot in React. Everything is working fine but the only thing missing is the image. Now if image's source is local, I can take screenshot of it. But if it's url, it shows a white space.
I can't seem to make it work. Any idea ?
To load image data into JavaScript (which is required by useScreenShot) you need to have permission to do so.
For local images, that is automatic. For crossorigin images you need to:
crossorigin attribute to request permission via CORS (e.g. <img src="http://placekitten.com/100/100" alt="" crossOrigin="anonymous" />)You can't load image data across origins without permission from the source of the image. The usual alternatives to CORS (as per the answer in the previous link), such as using a proxy, apply.