Image widget cannot bind Firebase upload URL (String vs ImagePath issue) #6974
Description
Can we access your project?
- I give permission for members of the FlutterFlow team to access and test my project for the sole purpose of investigating this issue.
Current Behavior
ello FlutterFlow team,
I am experiencing an issue when trying to preview an uploaded image in a page before saving the document to Firestore.
I am using Upload Media to Firebase Storage and storing the returned URL in the default action output variable:
uploadedFileUrl_uploadVehicleImage
The upload works correctly and the URL is valid. When I open the URL directly in the browser it displays the image without any issues.
Example URL:
https://firebasestorage.googleapis.com/...
However, in the FlutterFlow UI builder the Image widget Path field only accepts ImagePath types, while the upload output is a String URL.
Because of this:
- I cannot bind the upload output directly to the Image widget Path.
- Conditional values still expect ImagePath.
- The preview container either renders black or throws:
ImageCodecException: Failed to decode image
File header was [0x3c 0x78...]
This appears to happen because the widget expects an ImagePath type, not a String URL.
Steps to reproduce
- Create a page with a button using Upload Media to Firebase Storage.
- The upload returns a valid URL (String).
- Attempt to bind the result to an Image widget Path.
- FlutterFlow requires ImagePath instead of accepting the URL string.
Expected behavior
The Image widget should accept a Firebase Storage URL (String) as a valid Network image source.
Current behavior
The Image widget appears to require an ImagePath type instead of a String URL, making it difficult to preview uploaded images before saving them to Firestore.
Additional context
- Firebase Storage upload works correctly.
- Firestore saves the image URL correctly.
- The issue occurs only when trying to preview the uploaded image on the page.
If possible, please confirm:
- Whether this is expected behavior.
- The recommended way to preview uploaded images before saving the document.
Thank you.
Expected Behavior
ello FlutterFlow team,
I am experiencing an issue when trying to preview an uploaded image in a page before saving the document to Firestore.
I am using Upload Media to Firebase Storage and storing the returned URL in the default action output variable:
uploadedFileUrl_uploadVehicleImage
The upload works correctly and the URL is valid. When I open the URL directly in the browser it displays the image without any issues.
Example URL:
https://firebasestorage.googleapis.com/...
However, in the FlutterFlow UI builder the Image widget Path field only accepts ImagePath types, while the upload output is a String URL.
Because of this:
- I cannot bind the upload output directly to the Image widget Path.
- Conditional values still expect ImagePath.
- The preview container either renders black or throws:
ImageCodecException: Failed to decode image
File header was [0x3c 0x78...]
This appears to happen because the widget expects an ImagePath type, not a String URL.
Steps to reproduce
- Create a page with a button using Upload Media to Firebase Storage.
- The upload returns a valid URL (String).
- Attempt to bind the result to an Image widget Path.
- FlutterFlow requires ImagePath instead of accepting the URL string.
Expected behavior
The Image widget should accept a Firebase Storage URL (String) as a valid Network image source.
Current behavior
The Image widget appears to require an ImagePath type instead of a String URL, making it difficult to preview uploaded images before saving them to Firestore.
Additional context
- Firebase Storage upload works correctly.
- Firestore saves the image URL correctly.
- The issue occurs only when trying to preview the uploaded image on the page.
If possible, please confirm:
- Whether this is expected behavior.
- The recommended way to preview uploaded images before saving the document.
Thank you.
Steps to Reproduce
ello FlutterFlow team,
I am experiencing an issue when trying to preview an uploaded image in a page before saving the document to Firestore.
I am using Upload Media to Firebase Storage and storing the returned URL in the default action output variable:
uploadedFileUrl_uploadVehicleImage
The upload works correctly and the URL is valid. When I open the URL directly in the browser it displays the image without any issues.
Example URL:
https://firebasestorage.googleapis.com/...
However, in the FlutterFlow UI builder the Image widget Path field only accepts ImagePath types, while the upload output is a String URL.
Because of this:
- I cannot bind the upload output directly to the Image widget Path.
- Conditional values still expect ImagePath.
- The preview container either renders black or throws:
ImageCodecException: Failed to decode image
File header was [0x3c 0x78...]
This appears to happen because the widget expects an ImagePath type, not a String URL.
Steps to reproduce
- Create a page with a button using Upload Media to Firebase Storage.
- The upload returns a valid URL (String).
- Attempt to bind the result to an Image widget Path.
- FlutterFlow requires ImagePath instead of accepting the URL string.
Expected behavior
The Image widget should accept a Firebase Storage URL (String) as a valid Network image source.
Current behavior
The Image widget appears to require an ImagePath type instead of a String URL, making it difficult to preview uploaded images before saving them to Firestore.
Additional context
- Firebase Storage upload works correctly.
- Firestore saves the image URL correctly.
- The issue occurs only when trying to preview the uploaded image on the page.
If possible, please confirm:
- Whether this is expected behavior.
- The recommended way to preview uploaded images before saving the document.
Thank you.
Reproducible from Blank
- The steps to reproduce above start from a blank project.
Bug Report Code (Required)
Juliio
Visual documentation
ello FlutterFlow team,
I am experiencing an issue when trying to preview an uploaded image in a page before saving the document to Firestore.
I am using Upload Media to Firebase Storage and storing the returned URL in the default action output variable:
uploadedFileUrl_uploadVehicleImage
The upload works correctly and the URL is valid. When I open the URL directly in the browser it displays the image without any issues.
Example URL:
https://firebasestorage.googleapis.com/...
However, in the FlutterFlow UI builder the Image widget Path field only accepts ImagePath types, while the upload output is a String URL.
Because of this:
- I cannot bind the upload output directly to the Image widget Path.
- Conditional values still expect ImagePath.
- The preview container either renders black or throws:
ImageCodecException: Failed to decode image
File header was [0x3c 0x78...]
This appears to happen because the widget expects an ImagePath type, not a String URL.
Steps to reproduce
- Create a page with a button using Upload Media to Firebase Storage.
- The upload returns a valid URL (String).
- Attempt to bind the result to an Image widget Path.
- FlutterFlow requires ImagePath instead of accepting the URL string.
Expected behavior
The Image widget should accept a Firebase Storage URL (String) as a valid Network image source.
Current behavior
The Image widget appears to require an ImagePath type instead of a String URL, making it difficult to preview uploaded images before saving them to Firestore.
Additional context
- Firebase Storage upload works correctly.
- Firestore saves the image URL correctly.
- The issue occurs only when trying to preview the uploaded image on the page.
If possible, please confirm:
- Whether this is expected behavior.
- The recommended way to preview uploaded images before saving the document.
Thank you.
Environment
- FlutterFlow version:
- Platform:
- Browser name and version:
- Operating system and version affected:Additional Information
No response