将新用户信息从 Firebase v8 添加到 v9

Question

我有一个代码可以使用 Firebase v8 的图像和用户名创建用户，但我无法将其替换为 Firebase v9。

有人可以帮助我吗？谢谢！

    import { useState, useEffect } from 'react'
    import { projectAuth, projectStorage, projectFirestore } from '../firebase/config'
    import { useAuthContext } from './useAuthContext'
    
    export const useSignup = () => {
      const [isCancelled, setIsCancelled] = useState(false)
      const [error, setError] = useState(null)
      const [isPending, setIsPending] = useState(f`enter code here`alse)
      const { dispatch } = useAuthContext()
    
    
          // upload user thumbnail
          const uploadPath = `thumbnails/${res.user.uid}/${thumbnail.name}`
          const img = await projectStorage.ref(uploadPath).put(thumbnail)
          const imgUrl = await img.ref.getDownloadURL()
    
          // add display AND PHOTO_URL name to user
          await res.user.updateProfile({ displayName, photoURL: imgUrl })

Answer 1

documentation 包含 V8（命名空间） 和 V9（模块化） 语法的示例。您可以切换到模块化选项卡以供参考。对于这种情况，请尝试重构代码，如下所示：

import { ref, uploadBytes } from "firebase/storage"
import { updateProfile } from "firebase/auth"

const storageRef = ref(projectStorage, `thumbnails/${res.user.uid}/${thumbnail.name}`);

// 'file' comes from the Blob or File API
// uploadBytes() instead of .put()
uploadBytes(storageRef, file).then(async (snapshot) => {
  console.log('Uploaded a blob or file!');

  // updateProfile() is now a top-level function
  // and not a method on User object
  await updateProfile(res.user, {
    displayName: name
  });
  console.log("User profile updated")
});

还要确保您已分别使用 getAuth() 和 getStorage() 初始化身份验证和存储。

结帐：

Upload files with Cloud Storage on Web

Answer 2

import {st, db} from '../firebase/config'
import { getDownloadURL, ref, uploadBytesResumable } from 'firebase/storage';
import { doc, setDoc } from 'firebase/firestore';

const _storageRef = ref(st, "thumbnails/" + res.user.uid + "/" + thumbnail.name)
const _uploadTask = uploadBytesResumable(_storageRef, file);

_uploadTask.on("state_changed", (snapshot) => {
    console.log((snapshot.bytesTransferred/snapshot.totalBytes) * 100)
},(error) => {
    console.error(error)
}, async () => {
    await getDownloadURL(_storageRef)
          .then((url) => {
               //update database with the new image url
               console.log(url)
               //setDoc(doc(db, "users", uid), {
               //      photoURL: url
               //   }, {merge: true}) <- to not erase the rest of the values like displayName
          })
           .catch(error => console.error(error))
})

将新用户信息从 Firebase v8 添加到 v9

Adding new user information from Firebase v8 to v9

javascript

firebase

firebase-authentication