Token-Based Authentication for Fetching Images in FlutterFlow

Widgets & Design

Hello FlutterFlow Community,

I am new to Flutter and FlutterFlow. Sorry if it's a silly questions below.

I am developing an app that requires fetching a list of items from a server. The server responds the JSON containing a list of items and where static assets such as images are stored. To ensure security, each image request must include a valid authentication token in the HTTP header.

I am attempting to implement this within FlutterFlow using the image component. However, I've run into issues trying to pass the authentication token as an attribute in the image component, but it doesn't seem to work.

Has anyone encountered and overcome this issue? I am looking for insights, suggestions, or examples on how to pass authentication tokens in image fetch requests effectively in FlutterFlow.

Much appreciated.

What have you tried so far?

I tried to fetch requests include a valid token in the HTTP header, but I’ve encountered an issue where there isn’t a straightforward option in FlutterFlow to directly modify the HTTP headers for image components. Consequently, when the requests are sent out, they lack the necessary authentication tokens, leading to failed authentications on the server side.

I also attempted to customize the API call to include a valid token in the HTTP header. However, when trying to use the API response in the image components, I encountered an issue where the API response does not show an image type option. I am not sure how to place the images into image component.

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