Get Download Url after firebase's resize extension completed

user_4980141 0
Viewed 1202

This is what I am trying to achieve, implement the firebase's resize image extension, upload an image, then when the resize is completed, add that dowloadUrl's thumbs to a Cloud Firestore document. This question helps me, but still can not identify the thumbs and get the download URL, this is what am have been trying so far.

Note: I set my thumbnail to be at root/thumbs

const functions = require('firebase-functions');
const { Storage } = require('@google-cloud/storage');
const storage = new Storage();

exports.thumbsUrl = functions.storage.object().onFinalize(async object => {
    const fileBucket = object.bucket;
    const filePath = object.name;
    const contentType = object.contentType;
    if (fileBucket && filePath && contentType) {
        console.log('Complete data');
         if (!contentType.startsWith('thumbs/')) {
             console.log('This is not a thumbnails');
             return true;
         }
         console.log('This is a thumbnails');


    } else {
        console.log('Incomplete data');
        return null;
    }
});
firebase-storage google-cloud-functions firebase javascript
2 Answers

Method 1 : Client Side

  • Don't change the access token when creating the thumbnail.
  • Edit the function from gcloud cloud function console
  • Go to the function code by clicking detailed usage stats
  • Then click on code
  • Edit the following lines
  • Redeploy the function again
  // If the original image has a download token, add a
        // new token to the image being resized #323
        if (metadata.metadata.firebaseStorageDownloadTokens) {
            // metadata.metadata.firebaseStorageDownloadTokens = uuidv4_1.uuid();
        }
  • Fetch the uploaded image using getDownloadURLfunction
https://firebasestorage.googleapis.com/v0/b/<project_id>/o/<FolderName>%2F<Filename>.jpg?alt=media&token=xxxxxx-xxx-xxx-xxx-xxxxxxxxxxxxx
  • Because the access token will be similar
https://firebasestorage.googleapis.com/v0/b/<project_id>/o/<FolderName>%2Fthumbnails%2F<Filename>_300x300.jpg?alt=media&token=xxxxxx-xxx-xxx-xxx-xxxxxxxxxxxxx

Method 2: Server Side

Call this function after thumbnail is created

var storage = firebase.storage();
    var pathReference = storage.ref('users/' + userId + '/avatar.jpg');
    pathReference.getDownloadURL().then(function (url) {
        $("#large-avatar").attr('src', url);
    }).catch(function (error) {
        // Handle any errors
    });
user_123133210

you need to use filePath for checking the thumbs if(filePath.startswith('thumbs/'){...}

contentType has the metadata of files like type of image and etc. FilePath will have the full path.

user_121883350
Related