Firebase Cloud Storage Permission denied issue

Question

I started out with an issue simply displaying storage contents. The error message was the same Code 400 "Permission denied. Could not access bucket bucket. Please enable Firebase Storage for your bucket by visiting the Storage tab in the Firebase Console and ensure that you have sufficient permission to properly provision resources."

But the changes I made based on This stackoverflow question made the issue worse, now my upload form is giving the same error now and blocks file uploads, even after rolling back all the changes. I tried creating a brand new project on Firebase, but that has the same error. I also tried to set my bucket permissions to

service firebase.storage {
  match /b/{bucket}/o {
    match /{allPaths=**} {
      allow read;
      allow write;
    }
  }
}

since I thought that it could be a rights issue, but I get the same error.

Answer 1

I'm not sure what I was trying to do when I added this bit of code, but I had added

 { provide: StorageBucket, useValue: 'bucket' }

To my providers: on my app.module. I think it was a place holder for something and I forgot to remove it before committing the project.

This led me down and interesting troubleshooting path that finally led me to doing breakpoints and console logs until I found the issue.

   const task = this.storage.upload(filePath, file);

I did a console log of task, which gave me a location, that's where I found

 bucket: bucket

I then added the same console.log to a working project that showed

 bucket: whatever.appspot.com 

and I knew I made a mistake somewhere. I just happened across the entry in the app.module.ts file while trying to recreate the issue in stackblitz. The error is resolved.