I have a django server that has media served by nginx, I'm trying to load the media into my flutter app:
Image.network(
valueOrDefault<String>(
FFAppState().user.photo,
'https://stpeterlibrary.crabdance.com/static/images/LOGO%201.png',
)
The static images from the same site load just fine but the network images don't load at all, and give me this error:
Failed to detect image file format using the file header.
File header was [0x3c 0x21 0x44 0x4f 0x43 0x54 0x59 0x50 0x45 0x20].
Image source: encoded image bytes
the static file at images/LOGO%201.png is shown before the page loads the photos, then if the photo is null it shows the same error even though it was working. I think the error is related to the widget that is loading the image
Padding(
padding: EdgeInsetsDirectional.fromSTEB(16.0, 16.0, 16.0, 16.0),
child: InkWell(
splashColor: Colors.transparent,
focusColor: Colors.transparent,
hoverColor: Colors.transparent,
highlightColor: Colors.transparent,
onTap: () async {
await Navigator.push(
context,
PageTransition(
type: PageTransitionType.fade,
child: FlutterFlowExpandedImageView(
image: Image.network(
valueOrDefault<String>(
FFAppState().user.photo,
'https://stpeterlibrary.crabdance.com/static/images/LOGO%201.png',
),
fit: BoxFit.contain,
),
allowRotation: false,
tag: valueOrDefault<String>(
FFAppState().user.photo,
'https://stpeterlibrary.crabdance.com/static/images/LOGO%201.png',
),
useHeroAnimation: true,
),
),
);
},
child: Hero(
tag: valueOrDefault<String>(
FFAppState().user.photo,
'https://stpeterlibrary.crabdance.com/static/images/LOGO%201.png',
),
transitionOnUserGestures: true,
child: ClipRRect(
borderRadius: BorderRadius.circular(12.0),
child: Image.network(
valueOrDefault<String>(
FFAppState().user.photo,
'https://stpeterlibrary.crabdance.com/static/images/LOGO%201.png',
),
width: MediaQuery.of(context).size.width * 1.0,
height: 230.0,
fit: BoxFit.contain,
),
),
),
),
),
The problem was that my API would provide the image link in this form:
stpeterlibrary.crabdance.com/media/media_file.jpg
This made an error somehow with the Image.network(url), and by adding https://
https://stpeterlibrary.crabdance.com/media/media_file.jpg
It worked.