Firebase Cloud功能可在Firestore创建时调整图像大小

问题描述:

我正在努力实现以下目标.但是,我不知道我是Firebase的初学者.

I am trying to achieve following. But, I have no idea as I am a beginner to firebase.

  1. 用户正在尝试上传带有图片的帖子
  2. 已从网络浏览器中选择图像
  3. 当用户单击保存"按钮时,我将所选图像上传到firbase存储并获取下载URL.
  4. 将带有下载URL的帖子数据插入到Firestore数据库中.

至此,我已经完成.现在,我需要调整上传图像的大小.

Till this, I have completed. Now, I need to resize the uploaded image.

为此,我尝试使用Cloud Functions,每当将新条目添加到Firestore数据库时,我都在调用Cloud fountion,它可以使用该下载URL来访问图像的下载URL,我需要调整大小图像.请帮忙.

For that, I am trying to use Cloud Functions, whenever a new entry is added to firestore database, I am calling a Cloud fountion, which can access the download URL of the image, using this download URL, I need to resize image. Please help.

如果有更好的方法可以实现这一目标,请告诉我. (我知道应该有:P)

Please let me know, if there are having any better approach to achieve this. (I know there should be :P )

编辑1

谢谢坦率.

我具有下面的cloud函数,每次插入帖子时都会调用该函数.我正在从eventSnapshot获取图像的下载URL.我需要在该位置调整图像的大小.请帮忙.

I have the below cloud function, which will be called for every post is inserted. I am getting the download URL of the image from the eventSnapshot. I need to resize the image in that location. Please help.

exports.resizeImage = functions.firestore
.document('posts/{postId}')
.onCreate(event => {
        var eventSnapshot = event.data.data();
        //In this eventSnapshot I am getting the document, and I can get the download URL from the document
});

我已经分析了创建缩略图的示例,但为此,我需要
存储对象,只有在更改存储对象时才会调用它.但是,当在Firestore中调用onWrite时,我需要创建缩略图.

I have analyzed the example to create thumbnail, but for that, I need the
storage object, and it will be called only when the storage object is changed. But, I need to do the thumbnail creation when the onWrite called in firestore.

 exports.generateThumbnail = functions.storage.object().onChange((event) => {
  // File and directory paths.
  const filePath = event.data.name;
});

请让我知道如何通过在Firestore中检测onWrite并使用downLoadURL来进行图像调整大小的操作.

Please let me know, how to do the image resize operation, by detecting the onWrite in firestore and using downLoadURL.

我也已经在Firestore中创建了一个文档,我将其用作网站的后端.我也想调整图像大小(以适合卡片),然后将URL写回到firestore.我找到了一种解决方案,该解决方案使用与通过将图片上传到存储设备触发的标准示例不同的模式.

I, too, have created a document in firestore that I'm using as the backend to a website. I, too, would like to resize the image (to fit on a card) and write the URL back to firestore. I found a solution that uses a different pattern from the standard examples that are triggered by uploading the image to storage.

基本上,我将图像上传到存储中,然后将URL写入我的应用页面中的Firestore中.然后,我使用Firestore的onCreate()触发器来触发该函数.

Basically, I upload the image to storage and then write the URL into Firestore within my app page. I then trigger the function with Firestore's onCreate() trigger.

该函数从firestore中获取"image_name",并使用它来获取存储中的文件引用.接下来,它遵循generate-thumbnail firebase示例的模式.

The function grabs 'image_name' from firestore and uses that to get the file reference in storage. Next, it follows the patterns of the generate-thumbnail firebase example.

然后,诀窍是抓取了已签名的网址,并将其写回到img_src中的firestore中.

The trick was then grabbing the signedUrl and writing it back to firestore in img_src.

万一其他人觉得有用:

const functions = require('firebase-functions');
const gcs = require('@google-cloud/storage')({keyFilename: 'service-key.json'});
const spawn = require('child-process-promise').spawn;
const path = require('path');
const os = require('os');
const fs = require('fs');

exports.createCard = functions.firestore
  .document('work_cards/{cardID}')
  .onCreate((snap, context) => {
    const newCardData = snap.data()
    const bucket = gcs.bucket('your-project-id.appspot.com')
    const file = bucket.file(newCardData.image_name)
    const tempFilePath = path.join(os.tmpdir(), file.name);
    const thumbFileName = `thumb_${file.name}`;
    const thumbFilePath = bucket.file(thumbFileName)
    const contentType = file.contentType;
    const metadata = {
      contentType: contentType
    };

    return bucket.file(file.name).download({
        destination: tempFilePath,
      })
      .then(() => {
        return spawn('convert', [tempFilePath, '-thumbnail', '250x250', tempFilePath]);
      })
      .then(() => {
        return bucket.upload(tempFilePath, {
          destination: thumbFilePath,
          metadata: metadata,
        })
      })
      .then(() => {
        return thumbFilePath.getSignedUrl({
        action: 'read',
        expires: '03-09-2491'
        })
      })
      .then(signedUrls => {
        const img_src = signedUrls[0]
        return snap.ref.set({img_src}, {merge: true});
      })
      .then(() => {
        bucket.file(file.name).delete()
        fs.unlinkSync(tempFilePath)
        return
      })
    });