Is it possible to crop an online image using react-image-crop?

Question

I know that it is possible to crop an image that is locally stored in your computer using the npm package react-image-crop. But, is it possible to get an already uploaded/online image through its url and then crop it using the same package?

Answer 1

The example in the component's readme shows how to use it with an <img/>, so yes, I'd reckon it is possible to use the visual crop component with any image you can get an src to.

function CropDemo({ src }) {
  const [crop, setCrop] = useState<Crop>()
  return (
    <ReactCrop crop={crop} onChange={c => setCrop(c)}>
      <img src={src} />
    </ReactCrop>
  )
}

Actually cropping a remote image may not be possible entirely in the browser (using the Canvas API) thanks to cross-origin issues, but that's not what the component does, anyway.