使用Firestore时，如何用Storage Reference改写实时数据库参考代码

1. 上传文件到Cloud Storage并在Firestore保存引用 #

以下是上传文件同时在Firestore记录文件相关信息的实现，以图片上传为例：

Web/JavaScript 代码示例 #

// 初始化Storage和Firestore实例
import { getStorage, ref, uploadBytes, getDownloadURL } from "firebase/storage";
import { getFirestore, doc, setDoc } from "firebase/firestore";

const storage = getStorage();
const db = getFirestore();

async function uploadFileAndSaveRef(file, userId) {
  // 创建Storage存储路径，示例：users/{用户ID}/files/{文件名}
  const storageRef = ref(storage, `users/${userId}/files/${file.name}`);
  
  // 执行文件上传
  await uploadBytes(storageRef, file);
  
  // 获取文件的公开下载URL
  const downloadURL = await getDownloadURL(storageRef);
  
  // 在Firestore的userFiles集合中写入文件信息
  await setDoc(doc(db, "userFiles", file.name), {
    userId: userId,
    storagePath: storageRef.fullPath,
    downloadURL: downloadURL,
    uploadTime: new Date()
  });
  
  console.log("文件上传及记录保存完成");
}

2. 从Firestore读取Storage引用并获取文件 #

从Firestore取出文件记录后，关联操作Cloud Storage获取文件资源：

Web/JavaScript 代码示例 #

import { getStorage, ref, getDownloadURL } from "firebase/storage";
import { getFirestore, doc, getDoc } from "firebase/firestore";

const storage = getStorage();
const db = getFirestore();

async function getFileFromFirestoreRef(fileId) {
  // 从Firestore获取目标文件的记录
  const docRef = doc(db, "userFiles", fileId);
  const docSnap = await getDoc(docRef);
  
  if (docSnap.exists()) {
    const fileData = docSnap.data();
    // 通过Firestore中保存的storagePath创建Storage引用
    const storageRef = ref(storage, fileData.storagePath);
    // 可直接使用已保存的downloadURL，也可重新获取
    const downloadURL = fileData.downloadURL || await getDownloadURL(storageRef);
    
    // 此处可将downloadURL用于图片展示或文件下载
    console.log("文件下载URL:", downloadURL);
    return downloadURL;
  } else {
    console.log("未找到对应文件记录");
    return null;
  }
}

3. 删除Storage文件并同步删除Firestore记录 #

删除文件时同步清理Firestore中的对应记录：

Web/JavaScript 代码示例 #

import { getStorage, ref, deleteObject } from "firebase/storage";
import { getFirestore, doc, deleteDoc, getDoc } from "firebase/firestore";

const storage = getStorage();
const db = getFirestore();

async function deleteFileAndFirestoreRecord(fileId) {
  // 先从Firestore获取文件的存储路径
  const docRef = doc(db, "userFiles", fileId);
  const docSnap = await getDoc(docRef);
  
  if (docSnap.exists()) {
    const fileData = docSnap.data();
    const storageRef = ref(storage, fileData.storagePath);
    
    // 删除Cloud Storage中的文件
    await deleteObject(storageRef);
    // 删除Firestore中的文件记录
    await deleteDoc(docRef);
    
    console.log("文件及对应记录已删除");
  } else {
    console.log("未找到对应文件记录");
  }
}

关键注意事项 #

• 确保Firebase项目已开启Cloud Storage和Firestore服务，并配置了符合业务需求的安全规则（比如限制用户仅能操作自身文件）
• 移动端（Android/iOS）逻辑与Web端一致，仅SDK调用语法略有差异，比如Android使用StorageReference类，Firestore使用FirebaseFirestore类
• 若有特定业务场景（如批量操作、实时状态更新），可基于上述代码调整实现

内容的提问来源于stack exchange，提问作者novicecream