如何在上传文件到Firebase存储之前获取自动生成的文档ID，并将该ID用作Web的存储参考？

Question

Prior to submitting a batch of writes to the Firestore using an automatically generated ID from the Firestore, I have a method that will upload an image file to Firebase storage. Before uploading the documents to Firestore, the code is developed to wait for the file to be uploaded to obtain the download URL.

However, I want to use the Firestore document's auto-generated ID as the storage reference.

Here is my code:

 try {
  // To replace "organization.uid" with the auto-generated id by Firestore "organization_doc_ref.id".
  const storageRef = ref(this.storage, `organizations/${organization.uid}`);
  await uploadBytes(storageRef, blob).then(() => {
    console.info('Uploaded a blob or file!');
  });
  organization.logo_url = await getDownloadURL(storageRef);

  const batch = writeBatch(this.firestore);
  const organization_doc_ref = doc(
    collection(this.firestore, 'organizations')
  );
  batch.set(organization_doc_ref, organization);
  const usernameDocRef = doc(
    this.firestore,
    'usernames',
    organization.username
  );
  batch.set(usernameDocRef, { uid: organization_doc_ref.id });

  await batch.commit();
  console.log('Organization successfully created...');
} catch (error) {
  return console.error('Error writing document: ', error);
}

Answer 1

You just need to reorder your instructions so that the document reference is defined first. The document's ID will be generated locally and it won't interact with your server until you call batch.commit() .

try {
  const organization_doc_ref = doc(
    collection(this.firestore, 'organizations')
  );

  const storageRef = ref(this.storage, `organizations/${organization_doc_ref.id}`);
  await uploadBytes(storageRef, blob);
  console.info('Uploaded a blob or file!'); // avoid putting this in then() if using await
  organization.logo_url = await getDownloadURL(storageRef);

  const batch = writeBatch(this.firestore);
  batch.set(organization_doc_ref, organization);
  const usernameDocRef = doc(
    this.firestore,
    'usernames',
    organization.username
  );
  batch.set(usernameDocRef, { uid: organization_doc_ref.id }); // avoid using uid as it is often linked with the current Firebase Auth user's ID, use imgId, orgId or something similar

  await batch.commit();
  console.log('Organization successfully created...');
} catch (error) {
  return console.error('Error writing document: ', error);
}