Firebase Storage Images Upload Successfully But Won't Display

Images uploaded to Firebase Storage via FlutterFlow's "Upload media to Firebase" action save successfully and generate valid URLs, but the images don't display in the app during web testing. External image URLs (non-Firebase) work perfectly with the same setup.

Symptoms

What Works:

✅ File uploads to Firebase Storage successfully
✅ Valid download URL is generated (correct format with auth token)
✅ URL saves to Firestore field correctly
✅ Clicking URL directly in browser displays the image
✅ External URLs (Unsplash, etc.) display correctly in the same Image widget

What Doesn't Work:

❌ Firebase Storage images don't render in FlutterFlow web test mode
❌ Browser console shows: 403 (Forbidden) and CORS blocking errors
❌ No thumbnail preview in Firestore CMS for Firebase Storage URLs (external URLs show thumbnails)
❌ FlutterFlow CORS proxy shows "Deployed" but returns 403

Current Configuration

Firestore:

Field name: photo_url
Field type: Image Path

Image Widget:

Image Type: Tried both "Network" and "Uploaded File"
Binding: Authenticated User → photo_url field

Firebase Storage Rules:

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

FlutterFlow Settings:

Settings → Web Deployment → CORS Proxy for Images: Deploy with Firebase
Status shows: "Deployed" ✅
But browser still gets 403 errors on proxy URL

Browser Console Errors

Access to fetch at 'https://firebasestorage.googleapis.com/v0/b/[PROJECT].firebasestorage.app/o/...' 
has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

403 (Forbidden)

Questions

Is FlutterFlow's CORS proxy actually deployed? It shows "Deployed" in settings but I can't find a corsProxy service in Cloud Run or Cloud Functions.
Is this web-only? Will this work on iOS/Android apps, or is this a cross-platform issue?
Image Path field type: Do Firebase Storage URLs require special handling with Image Path fields? External URLs work fine.
Alternative solutions: Should I use a different field type or widget configuration for Firebase Storage images?

Expected Behavior

Firebase Storage images should display in the app just like external image URLs do.

Actual Behavior

Firebase Storage images upload successfully and URLs save correctly, but images don't render

Platform

Testing on: Web (Chrome)
FlutterFlow version: Current/Latest
Issue appears in: Test/Run mode

What I've Tried

FlutterFlow Side:

Toggled CORS Proxy on/off and redeployed
Tried both "Network" and "Uploaded File" image types
Verified image widget binding is correct
Tested in different browsers and incognito mode
Restarted app completely (not a cache issue)

Firebase Side:

Set Storage rules to public read (allow read: if true)
Added FlutterFlow debug domain to Firebase Auth Authorized Domains
Added allUsers with Storage Object Viewer role to bucket permissions
Attempted CORS configuration via Google Cloud Shell (failed due to account restrictions)

Testing:

Manual URL paste test: Copied Firebase Storage URL and manually pasted into Firestore - same issue
External URL test: Non-Firebase URLs work perfectly in same field
Browser extension: Tried "Allow CORS" extension - no change

Screenshot 1- Looking at my database, the empty spot for Chaintester C is where an image should be.

Screenshot 2 - But if I click into that space, a new window opens, and the image is there. And if I click edit, the URL is there.

Screenshot 3 - The image does not render when running tests in-browser on the web. They do with the other photos, like the one shown above, tester C. Those are URLs from Unsplash that I manually pasted in.

Screenshots 4 and 5: Settings for uploading images and updating the database.

Firebase Storage Images Upload Successfully But Won't Display - CORS Proxy Issue?