Firebase Image Resize Extension. Referencing the resized images

问题

first time jumping into the Firebase extensions and felt Image Resizer was a good one to use for my needs.

However, the documentation on using it is a little thing and leaving me a bit stuck.

Currently, I upload the image, it auto generates the new dimension and saves them to my desired path. However, I am unable to figure out how to call the now resized image.

I am currently storing the uploaded image with a path like so;

      var storageRef = firebase.storage().ref("Project_Image/" + this.projectName + "/" + file.name);

and then getting the original photo as a url using a reference like so;

firebase.storage()
  .ref("Project_Image/" + this.projectName + "/" + file.name).getDownloadURL()
  .then((url) => {
    this.imageURL = url;
    // eslint-disable-next-line no-console
    console.log("Getting Image " + this.imageURL);
  })

This works, but the problem is I am unable to reference the newly created 600x300 resized image. Now called imagename_600x300.jpeg.

I tried using

.ref("Project_Image/" + this.projectName + "/" + file.name + "_600x300")

but obviously, that grabs "imagename.jpeg_600x300" and, therefor returns an error/undefined.

I am not sure if there is a better way to initially store these files that would help with retrieving, or if there is an obvious answer.

thanks!

回答1:

It sounds like you need to strip off the extension and put it after the prefix. Something like this should work:

function resizedName(fileName, dimensions = '600x300') {
  const extIndex = fileName.lastIndexOf('.');
  const ext = fileName.substring(extIndex);
  return `${fileName.substring(0, extIndex)}_${dimensions}${ext}`;
}

来源：https://stackoverflow.com/questions/59898338/firebase-image-resize-extension-referencing-the-resized-images