1

I am working on a React website where I want to add watermark on an image when user reads that image from Firebase storage. So is there any way to add watermark while reading the image from the storage ?

I've already gone through How to add an image or text (Watermark) on a video/image - Flutter/Dart but it's related to Flutter/Dart, but I want the answer for REACT.

Kindly guide me through this.

Thanks

Kundan
  • 1,754
  • 16
  • 37

1 Answers1

1

If you want to add a watermark to images in to Firebase Storage, I'd typically do that using a Cloud Function that triggers when the image is uploaded. You can base it on the example image converter here: https://github.com/firebase/functions-samples/tree/master/convert-images

The sample uses Image Magick to perform the conversion, so you can also use Image Magick to add a watermark to the image.

Frank van Puffelen
  • 565,676
  • 79
  • 828
  • 807
  • That GitHub link you shared is just converting the image extension. – Kundan Jun 17 '20 at 04:13
  • Yes, that's why I said. But it shows how to call Image Magick in a Cloud Function. The second link them shows a way that Image Magick can be used to add a watermark to an image. You'll have to combine the two steps into a single solution yourself. – Frank van Puffelen Jun 17 '20 at 04:14