我正在使用ReactJS在我的SimpChat应用程序上传数据从我的注册表到Firestore数据库，我得到了一个错误，未捕获（承诺）FirebaseError：火源储存：对象'john'不存在。（storage/object-not-found）。哪里出现了错误？如何解决？

以下是我的注册表代码：

import React from 'react'
import { useState } from 'react';
import Add from "../img/addAvatar.png"
import { createUserWithEmailAndPassword, updateProfile } from "firebase/auth";
import { auth, storage } from "../firebase";
import { ref, uploadBytesResumable, getDownloadURL } from "firebase/storage";
import { doc, setDoc } from "firebase/firestore"; 
import { db } from "../firebase";

const Register = () => {
  const [err,setErr] = useState(false);
  const handleSubmit = async (e) => {
    e.preventDefault()
    
    // console.log(e.target[0].value)
    const displayName = e.target[0].value;
    const email = e.target[1].value;
    const password = e.target[2].value;
    const file = e.target[3].files[0];

    try {
    const res = await createUserWithEmailAndPassword(auth, email, password)

    
    const storageRef = ref(storage, displayName);
    
    const uploadTask = uploadBytesResumable(storageRef, file);
    
    // Register three observer
    uploadTask.on(
      (error) => {
        setErr(true);
      }, 
      () => {
        getDownloadURL(uploadTask.snapshot.ref).then(async (downloadURL) => {
          await updateProfile (res.user, {
            displayName,
            photoURL: downloadURL,
          });

          await setDoc(doc(db, "users", res.user.uid), {
            uid: res.user.uid,
            displayName,
            email,
            photoURL: downloadURL,
          });
        });
      }
    );

    } catch (err) {
      setErr(true);
    }
  }

  return (
    <div className='formContainer'>
        <div className='formWrapper'>
            
            <span className="logo">SimpChat</span>
            <span className="logo">Register</span>
            
            <form onSubmit={handleSubmit}>
                <input type="text" placeholder='display name'/>
                <input type="email" placeholder='email' />
                <input type="password" placeholder='password' />
                <input style={{ display: "none" }} type="file" id='file' />
                <label htmlFor="file">
                    <img src={Add} alt="" />
                    <span>Add an avatar</span>
                </label>
                <button>Sign up</button>
                {err && <span>Something went wrong</span>}
            </form>

            <p>You do have an account? Login</p>

        </div>
    </div>
  )
}

export default Register