How to properly upload image to Firebase Storage and save link to firestore

Looked at this link How to upload image to firebase storage and save reference in the database in single transaction?, the recommended ones below it, softauthor and a few other sites to find out what I’m doing wrong but none worked. I’m trying to post the image to Storage then update the link in RTDB and Firestore. Here’s the snippet, what am I doing wrong? (403 error) + Object { code_: "storage/object-not-found"

updatePfp.addEventListener("change", (e) => {
  file = e.target.files[0];
  var storageRef = firebase.storage().ref("users").child(user.uid);
  storageRef.put(file)
  firebase.storage().ref("users").child(user.uid).getDownloadURL()
    .then(imgUrl => {
      var downloadURL = imgUrl;
      db.collection("userInfo")
        .doc(user.uid)
        .update({
          downloadURL: downloadURL,
        })
        .then(function() {
          alert("saved");
        })
        .catch(function(error) {
          alert(error);
        });
    });
});

>Solution :

You need to wait until the file has been completely uploaded before you can request its download URL.

storageRef.put(file).then(() => {
  firebase.storage().ref("users").child(user.uid).getDownloadURL()
    .then((downloadURL) => {
      ...