如何从本地React应用服务器访问Firebase Storage中的文件？

Absolutely—this is totally feasible, and that permission_denied warning you’re seeing has nothing to do with your app running locally. It’s almost always tied to misconfigured Firebase security rules or an authentication gap. Let’s break this down clearly:

First, a quick clarification: your error message references @firebase/database (a Realtime Database set operation failed), but you mentioned Firebase Storage. Double-check if you accidentally called a Realtime Database API instead of Storage’s methods—mixing these up is a common slip-up!

Fix Steps Based on Which Service You’re Using: #

If You’re Working with Realtime Database (Matches Your Error): #

Default Firebase Realtime Database rules restrict access to authenticated users only (and can even lock down completely after a trial period). Here’s how to fix it:

• Test with temporary open rules (never leave this in production!):
  Update your database rules in the Firebase Console to:

  {
    "rules": {
      ".read": true,
      ".write": true
    }
  }
  

  If this resolves the error, your original rules were too restrictive.
• Set production-ready secure rules:
  For user-specific data like /users/{uid}, use rules that only let the owner access their data:

  {
    "rules": {
      "users": {
        "$uid": {
          ".read": "$uid === auth.uid",
          ".write": "$uid === auth.uid"
        }
      }
    }
  }
  

• Verify user authentication:
  If your rules require auth.uid, your React app must have a logged-in user before making that set call.

If You Actually Meant Firebase Storage: #

Storage has its own separate security rules. Follow similar troubleshooting steps:

• Temporary test rules:
  In the Firebase Console, update your Storage rules to:

  rules_version = '2';
  service firebase.storage {
    match /b/{bucket}/o {
      match /{allPaths=**} {
        allow read, write: if true;
      }
    }
  }
  

• Secure production rules:
  For user-specific storage paths (like users/{uid}/files), use:

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

• Check CORS (rare but possible):
  Local dev servers might hit CORS issues with Storage. Create a cors.json file:

  [
    {
      "origin": ["http://localhost:3000"],
      "method": ["GET", "POST", "PUT"],
      "maxAgeSeconds": 3600
    }
  ]
  

  Then run this via Firebase CLI:

  gsutil cors set cors.json gs://your-bucket-name.appspot.com
  

Final Note: #

Local React apps have full access to Firebase services—this error is just Firebase enforcing your security rules (or a misconfiguration in them). Always lock down your rules after testing, and ensure your app handles user authentication properly if your rules require it.

内容的提问来源于stack exchange，提问作者lukaszpolowczyk