Firebase Storage Error 403. Keep getting an error around the security rules for my upload function when including the file name

Question

I keep getting an error that only pops up when I try to include the name of the uploaded file to my users bucket. Here are my firebase storage rules:

rules_version = '2';
service firebase.storage {
  match /b/{bucket}/o {
    match /users/{uid}/{designfile}{
      allow read, write: if request.auth.uid == uid;
    }
  }
}

and here is the js function i'm using to upload the file:

fileButton.addEventListener('change', function(e)
{
  // Get file
  var file = e.target.files[0];
  var fileName = file.name;

  firebase.auth().onAuthStateChanged(function(user)
  {
    if (user)
    {
      // User is signed in.
      console.log(user);
      // get idtoken
      user.getIdToken().then(function(idToken)
      { // <------ Check this line
        console.log(idToken); // It shows the Firebase token now
      });
      console.log(user.uid);
      firebase.storage().ref('users').child(user.uid + fileName).put(file);
    }
    else
    {
      // No user is signed in.
      console.log("state = definitely signed out");
    }
  });

});

Any suggestions would really help me!

Answer 1

The solution was the following:

 firebase.storage().ref('users').child(user.uid + "/" + fileName).put(file);