Recommand · October 22, 2021 0

How to create a thumbnail image when a new firestore document is created, and when that document contains image url saved in cloud storage?

I would like to achieve the following, but I am currently stuck because the API docs are just too hard. I would like some guidance.

Create a thumbnail image, resizing the image to a width of 100px.

Here are the details to what should be done.

  1. The thumbnail image should be created whenever a new document is created in Firestore Database.
  2. The document contains a url of the image stored in Firebase Cloud Storage.
  3. The generated thumbnail should be stored to the same directory as the original image.
  4. The url of the thumbnail image should be updated to the Firestore Database document field.

I am currently using TS but replies in JS would be fine also.

Here is the code that shows my current progress.

const firestore = admin.firestore();

export const generateThumbnailOnCreate = functions
  .onCreate(async (snap, context) => {
    const doc =;
    const missionImgUrl = doc.mission_img_url;

     * TODO
     * use the mission img url to access the cloud storage
     * create thumbnail at the storage directory
     * get the permanent thumbnail url update firestore document

    return snap.ref
      .update({ thumbnail_img_url: thumbnailImgUrl })
      .then((docRef) => console.log("Success"))
      .catch((err) => console.error("Error"));