💬
Get Help
IS
Iselin Skjervik

FlutterFlow Network Image displays null instead of valid image.url from Xano GET API

Database & APIs

I’m trying to set up a GET API in Xano that returns data with images stored in Xano Vault. When I test the API endpoint directly,

I have a GET endpoint in Xano that returns a list of data that looks like this:

{

"id": 1,

"name": "Carly"

"image": {

"url": "https://…xano.io/vault/…png",

}

// … other fields …

}

When I test the API in FF, I receive the correct image.url in the response. However, in FlutterFlow—when I configure a Network Image widget — I always see “null” under Image in the UI builder/preview, and no image GET requests appear in DevTools.

Can someone please explain how to display images from Xano in FF? Best practice?

What have you tried so far?

What I’ve tried so far:

  1. JSON Path

    • Used the recommended path $[:].image.url (as a string), both with and without enabling “Is List.”

  2. Custom Data Types

    • Created a “Pproducts” Data Type as a list, with a field imageUrl (string).

    • Enabled “Parse as Data Type” on the API call and bound the response to the “Products” list.

  3. Nested Data Type

    • Added a separate “Image” Data Type with a field url, and updated “Products” to include an image field of type “Image.”

    • Tried marking image.url as “Is List” without success.

  4. Alternative Field Types

    • Tested using “Image Path” instead of a string field for the URL, but got “null” in the API response test.

  5. DevTools Inspection

    • Confirmed that FlutterFlow does not send any GET requests for .png/.jpg.

    • Saw no CORS, 404, or related errors in the Console.

I´ve tried a lot of different things, so not sure if I´ve remembered everything and explained it all very good, but hopefully someone will understand and knows a solution.. 🙂

Did you check FlutterFlow's Documentation for this topic?
Yes
3