Question

所以我对整个编码领域还是一个新手，正在尝试学习如何使用react native进行编码。现在，我正在尝试找出如何使用Firebase（函数）和Google云存储上传图像。

下面是后端代码，使我可以将每个提交的图片上传到Firebase。

我想知道是否可以修改此代码，以便每个提交可以上传多个图像？如果是这样，我将如何去做？

exports.storeImage = functions.https.onRequest((request, response) => {
  return cors(request, response, () => {
          const body = JSON.parse(request.body);
          fs.writeFileSync("/tmp/uploaded-image.jpg", body.image, "base64", err => {
            console.log(err);
            return response.status(500).json({ error: err });
          });
          const bucket = gcs.bucket("myapp.appspot.com");
          const uuid = UUID();

          return bucket.upload(
            "/tmp/uploaded-image.jpg",
            {
              uploadType: "media",
              destination: "/places/" + uuid + ".jpg",
              metadata: {
                  metadata: {
                      contentType: "image/jpeg",
                      firebaseStorageDownloadTokens: uuid
                  }
              }
            },
            (err, file) => {
              if (!err) {
                return response.status(201).json({
                  imageUrl:
                    "https://firebasestorage.googleapis.com/v0/b/" +
                    bucket.name +
                    "/o/" +
                    encodeURIComponent(file.name) +
                    "?alt=media&token=" +
                    uuid,
                  imagePath: "/places/" + uuid + ".jpg"
                });
              } else {
                console.log(err);
                return response.status(500).json({ error: err });
              }
            }
          );
      })
      .catch(error => {
        console.log("Token is invalid!");
        response.status(403).json({error: "Unauthorized"});
      });
  });
});

Answer 1

我没有一个容易使用的React Native环境，但是我相信您可以使用以下代码从客户端执行此操作：

await firebase.storage().ref('test/test.jpg').putFile('/path/to/test.jpg');
let downloadUrl = await firebase.storage().ref('test/test.jpg').getDownloadURL();
console.log('downloadUrl :', downloadUrl); // do whatever you need with it

要上传另一张图片，您只需调用两次代码，甚至可以同时进行。

使用Firebase时，您应该直接从客户端执行大部分操作，因此，如果需要进行繁重的处理，则只需要后端（包括云功能）代码，请使用admin SDK，并与第三方应用集成，或类似的东西。对于简单的数据库或存储操作，客户端将更适合您。

此外，您不需要自己编写下载URL，getDownloadUrl()会为您完成。而且，如果您从客户端访问存储，它将自动与Firebase Auth集成，从而可以保护您的数据。

在React Native中将多个图像上传到Firebase

1 个答案: