将文件上传到 Firebase 存储

Question

我正在开发这个项目，该项目允许用户从本地计算机将文件上传到 Firebase 存储。用户选择要上传到 Firebase 存储或 Firestore 的文件或图像，如果成功，将显示一条消息。

下面是我为实现该任务而编写的代码，但它返回错误，说 .put 不是函数。

const handleUpload = () => {
    setUploading(true);
    const storageRef = ref(storage, `files/${file.name}`)
      .put(file)
      .then((snapshot) => {
        console.log(snapshot);
        storageRef("files")
          .child(file.name)
          .getDownloadURL()
          .then((url) => {
            db.collection("myFiles").add({
              timestamp: db.FieldValue.serverTimestamp(),
              caption: file.name,
              fileUrl: url,
              size: snapshot.bytesTransferred,
            });
            setUploading(false);
            setOpen(false);
            setFile(null);
          });
        storageRef("files")
          .child(file.name)
          .getMetadata()
          .then((meta) => {
            console.log(meta.size);
          });
      });
  };

Answer 1

鉴于您调用了一个名为 ref

的 函数，看来您正在使用模块化 API 语法通过 Firebase 访问 Cloud Storage。在该语法中，许多 API 调用都是顶级函数，您可以显式导入这些函数，然后以类似于调用方式的方式进行调用

ref

。

模块化 API 中用于上传数据的顶级函数是

uploadBytes

和

uploadString

。我建议查看此文档以获取其中的示例。

由于您的其余代码使用 Firebase 也支持的更传统的命名空间 API，因此我建议您还阅读有关 升级到模块化 API 的指南，并特别关注 使用

compat

库的部分，这实际上可能允许您通过较小的更改让代码正常工作。