在 React Native 中将多个图像上传到 firebase答案

【问题标题】：Uploading multiple images to firebase in React Native在 React Native 中将多个图像上传到 firebase
【发布时间】：2018-08-13 16:11:25
【问题描述】：

所以我对整个编码场景非常陌生，并且正在尝试学习如何使用 react native 进行编码。现在，我正在尝试弄清楚如何使用 firebase（函数）和谷歌云存储上传图片。

下面是后端代码，使我能够将每次提交的图像上传到 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"});
      });
  });
});

【问题讨论】：

感谢 Doug 对标签的帮助！
嗨，我来自另一个问题。我可以帮助编写代码，但首先我想知道您为什么决定从云函数而不是直接从 React Native 执行此操作。似乎在客户端这样做会产生更简单的代码，而且成本也会更低，因为您只需为存储付费，而不为云功能执行付费。
嗨，里卡多。主要原因是这是基于我在网上学到的一个讲座啊哈哈哈。所以我没有特别偏好我想写哪种方式。这正是我被教导能够将图像上传到 Firebase 以及获取它们各自的 url 和 urlPaths 的方式
再次感谢里卡多的帮助 :)

标签： firebase react-native google-cloud-functions

【解决方案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 时，您应该直接从客户端执行大部分操作，因此如果您需要做一些繁重的处理，您只需要后端（包括云功能）代码，使用管理 SDK，与第三方应用程序集成，或类似的东西。对于简单的数据库或存储操作，客户端会更适合您。

另外，您不需要自己编写下载 URL，getDownloadUrl() 会为您完成。如果您从客户端访问存储，它会自动与 Firebase 身份验证集成，以便您保护数据。

【讨论】：

如果多张图片怎么getDownloadUrl