[SOLVED] Firebase storage security rules 400 error issue "Permission denied. Could not access bucket xxxxx-****.appspot.com"

Firebase storage security rules 400 error issue "Permission denied. Could not access bucket xxxxx-****.appspot.com"

I keeps getting message error from firebase link saying 400 error with my firebase storage upload in my react project when trying to upload photo... everything were working fine before and uploads images successfully, but now it stop uploading of photo giving the following error, i don't know where the problem is...

The link that prompt out in inspect

POST https://firebasestorage.googleapis.com/v0/b/xxxxx-****.appspot.com/o?name=usertemp%2F0rdrGK4MRDRptAMCc3mHDveytJv1%2F0rdrGK4MRDRptAMCc3mHDveytJv1.jpg 400 ()

Here is the error from the link response

{
  "error": {
    "code": 400,
    "message": "Permission denied. Could not access bucket xxxxx-****.appspot.com. 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."
  }

Here is my security

service firebase.storage {
  match /b/{bucket}/o {
    match /{allPaths=**} {
      allow read, write: if request.auth!=null;
    }
  }
}

I still tried changing the match to /b/xxxxx-****.appspot.com/o with still no success

Solution

This is due to a missing permission. You need to check whether you have

firebase-storage@system.gserviceaccount.com

as a member with a "Storage Admin" role. If you don't have one, then add it. That would fix the issue.

Here's the step on how you can check and add permissions.

Go to Cloud console
Navigate to Storage
Select your bucket then click show info panel.

You can also add the missing permission in the IAM & Admin if you want.