Flutter_cached_network_image: HttpException: No valid statuscode.

[ssbaval]

I have sentry running and looked at my logs - for this error sentry was triggered 237 times in 1 day !.

If the URL is invalid, not found or malformed - I was under the impression that an error widget would be rendered instead ??

Exception is :

HttpException: HttpException: No valid statuscode. Statuscode was 403
  File "cache_manager.dart", line 120, in BaseCacheManager.getFile
  File "<asynchronous suspension>"
  File "cached_image_widget.dart", line 270, in CachedNetworkImageState._animatedWidget
  File "cached_image_widget.dart", line 196, in CachedNetworkImageState.build
  File "framework.dart", line 4047, in StatefulElement.build
  File "framework.dart", line 3941, in ComponentElement.performRebuild
  File "framework.dart", line 3738, in Element.rebuild
  File "framework.dart", line 3924, in ComponentElement._firstBuild
  File "framework.dart", line 4088, in StatefulElement._firstBuild
  File "framework.dart", line 3919, in ComponentElement.mount
  File "framework.dart", line 3101, in Element.inflateWidget
  File "framework.dart", line 5233, in MultiChildRenderObjectElement.mount
  File "framework.dart", line 3101, in Element.inflateWidget
  File "framework.dart", line 2904, in Element.updateChild
  File "framework.dart", line 3961, in ComponentElement.performRebuild
  File "framework.dart", line 3738, in Element.rebuild
  File "framework.dart", line 3924, in ComponentElement._firstBuild
  File "framework.dart", line 4088, in StatefulElement._firstBuild
  File "framework.dart", line 3919, in ComponentElement.mount
  File "framework.dart", line 3101, in Element.inflateWidget
  File "framework.dart", line 5233, in MultiChildRenderObjectElement.mount
  File "framework.dart", line 3101, in Element.inflateWidget
  File "framework.dart", line 5233, in MultiChildRenderObjectElement.mount

[renefloor]

This should be improved in 1.1.2, could you try to verify that?

[guillaumeprevost]

Hello, we're building our App based on your pretty cool plugin ! Thanks for the hard work btw :)

We are running into the same issue: we're loading AWS S3 pictures dynamically, and when the picture doesn't exist, AWS S3 returns an HTTP 403 error (not 404).

Upgrading from 1.1.0 to version 1.1.3 didn't solve the issue :(

Here is the error displayed in the logs:

I/flutter ( 5123): CacheManager: Failed to download file from https://s3-ap-southeast-2.amazonaws.com/friend-theory/url/that/does/not/exist.jpg with error:
I/flutter ( 5123): HttpException: No valid statuscode. Statuscode was 403

The issue is that the exception is handled and logged by the plugin, so we don't have a way to handle it in our App if we wanted to.

Additionally, because there are a lot of pictures trying to be loaded and they fail to load, the plugin retries to download them every time the widget rebuilds, ending in:

1. Wasted resources
2. A lot of network calls
3. Cluttering the logs with potentially hundreds of this log

The solutions we can suggest are to:

• handle the exception by marking this picture as having failed to load, and retry to load it only after a certain amount of time has passed (in a way, "caching the fact that it failed to load")
• not handle the exception in the plugin and leave it to the caller to handle it if there is an exception
• not ideal but slightly better: simply not show this log which at least would solve point 3.

Cheers!

[dspoonia7]

I'm having this issue as well. Any ETA or plans to get it fixed?

[renefloor]

No sorry, I don't have an ETA for it. I first have to find out why it fails.

[vanlooverenkoen]

We should be able to handle the errors ourselves.

[phpirate]

It makes no sense to fail on a 404, or what ever HTTP response other than 200, this is just really annoying to simply through an exception without notifying the caller, it just makes no sense and really just because of this issue i started to consider other frameworks to use rather than Flutter, even though i love it!

[vanlooverenkoen]

This should be fixed in the latest flutter version. Stable release will probably this week

[renefloor]

@vanlooverenkoen how did the Flutter framework fix this? What was the PR or issue for it?

[vanlooverenkoen]

This is fixed in the Flutter framework:
https://github.com/flutter/flutter/issues/53267
https://github.com/flutter/flutter/pull/53329

So flutter_cached_network_image should probably update the implementation as well.

[renefloor]

I guess this should partly fix it for the ImageProviders, but I'm not sure if it really fixes the issues mentioned here.

[vanlooverenkoen]

You can already test this on beta. I did some testing. Our errors removed after using beta, dev or master

[netgfx]

So is this fixed now? Because I'm still getting this error

[renefloor]

@netgfx do you get the errors when using the imageprovider or 2.3.0-beta?

[netgfx]

I'm using latest stable cached_network_image: ^2.2.0+1

Using it like this:

CachedNetworkImage(
                imageUrl: widget.list[index].thumb,
                placeholder: (context, url) => CircularProgressIndicator(),
                errorWidget: (context, url, error) => Icon(Icons.error),
                fit: BoxFit.fill,
                width: 64,
                height: 64,
              ),

When the url pulls a 404 the App crashes or in dev uncaught error is thrown.

[renefloor]

It really crashes? I wouldn't expect that, you see it crashing?
But did you try the beta I said? Version 2.3.0-beta or 2.3.0-beta.1?

[netgfx]

Sometimes it crashes and other times (usually in debug mode) any other loading fails if one comes 404, all I see are spinners from that point on. I will try the beta versions and post results.

[netgfx]

@renefloor When I use the beta.1 I get the following error:

Leading widget consumes entire tile width. Please use a sized widget.
'package:flutter/src/material/list_tile.dart':
Failed assertion: line 1353 pos 7: 'tileWidth != leadingSize.width'

I have the image inside a ListTile like this:

ListTile(
                      contentPadding: EdgeInsets.only(
                          left: 4.0, right: 8.0, top: 4.0, bottom: 4.0),
                      leading: CachedNetworkImage(
                        imageUrl:
                            "https://www.themealdb.com/images/ingredients/" +
                                Uri.encodeComponent(item.title) +
                                ".png",
                        placeholder: (context, url) =>
                            CircularProgressIndicator(),
                        errorWidget: (context, url, error) => Icon(Icons.error),
                        fit: BoxFit.fill,
                        width: 32,
                        height: 32,
                      ),
                      title: Text(item.title, style: Styles.listText),
                      trailing: Icon(Icons.add),
                      onTap: () {
                        Navigator.of(context).pop();
                      }),

[renefloor]

This is not related to the HttpException, and thus offtopic, but you can just add a sized box right? Didn't you have this problem with 2.2.0?

[netgfx]

Yes sorry for offtopic just thought it was useful to mention. No that issue didn't exist with 2.2.0 and frankly it shouldn't have because I'm already setting specific dimensions.
In terms of the http exception it is not crashing anymore, however on debug mode it still fires the uncaught error breakpoint and from that point on all other images that load in "parallel" display the spinning loader and never complete or show the error icon.

[renefloor]

I think I can fix that size issue soon. (See https://github.com/Baseflow/octo_image/issues/7)
The debugging is something that is related to the dart vm debugger which I cannot fix (easily).

For now you could disable 'break on uncaught exceptions' in the debugger settings.

[aaironman]

It's happened the same problem.I'm using latest stable cached_network_image: ^2.2.0+1. If the url pulls a 404 and the app crashes.
EasyRefresh.custom(
slivers: [
SliverList(
delegate: SliverChildBuilderDelegate((context, index) {
if (bannerList != null && bannerList.length > 0 && index == 0) {
return _banner(bannerList);
}
CommunityModel item = (bannerList != null && bannerList.length > 0)
? items[index - 1]
: items[index];
return Container(
child: ListTile(
leading: _circleRoundImg(item.image_list),
title: new Text(item.theme_name),
subtitle: new Text(
item.info, maxLines: 1, overflow: TextOverflow.ellipsis,),
isThreeLine: false,
onTap: (){
_navigationToDetails(item);
},
),
decoration: BoxDecoration(
border: Border(
bottom: BorderSide(color: Theme
.of(context)
.dividerColor)
)
),
);},
childCount: (bannerList != null && bannerList.length > 0) ? items
.length + 1 : items.length,
)
)
],
enableControlFinishRefresh: true,
enableControlFinishLoad: false,
controller: _controller,
onRefresh: _onRefresh,
header: MaterialHeader(),
)

Widget _circleRoundImg(String imgUrl) {
return SizedBox(
width: 60,
height: 60,
child: Center(
child: CachedNetworkImage(
imageUrl: imgUrl,
imageBuilder: (context,imageProvider)=> Container(
decoration: BoxDecoration(
image:DecorationImage(
image: imageProvider,
fit: BoxFit.cover
)
),
),
placeholder: (context, url) =>
const CircularProgressIndicator(),
errorWidget: (context, url, error) => const Icon(Icons.error),
),
),
);
}

[renefloor]

@aaironman Did you really see the app crashing or did you see an error in the console?

[kauaicreative]

Why is this closed? I'm having to remove the widget until this issue is fixed. Throwing an exception should not be the result of a imageUrl 404 but rather loading a valid errorWidget, right?

Exception has occurred. HttpExceptionWithStatus (HttpException: Invalid statusCode: 404, uri =...

[netgfx]

I'm using cached_network_image: ^2.3.0-beta.1 which I believe will be soon released and I no longer get the error @kauaicreative

[aaironman]

@aaironman Did you really see the app crashing or did you see an error in the console?

Yeah,I throws exception from the class of web_helper.

Exception has occurred.
HttpExceptionWithStatus (HttpException: Invalid statusCode: 404, uri = http://img.spriteapp.cn/ugc/2018/08/d540cb169f8811e8b438842b2b4c75ab.jpg)

[netgfx]

@aaironman Can you try with version cached_network_image: ^2.3.0-beta.1 that fixed it for me. I just keep an eye when this fix will make it to release in order to update to the stable version. But if you want to continue your work just do a try with the beta version.

[aaironman]

@netgfx It's the same problem for me with the version cached_network_image: ^2.3.0-beta.1.

[netgfx]

@aaironman Can you try adding a errorWidget: (context, url, error) => Icon(Icons.error), on your configuration of the image and see if it gets handled?

[aaironman]

@netgfx my code:
return SizedBox(
width: 60,
height: 60,
child: Center(
child: CachedNetworkImage(
imageUrl: imgUrl,
imageBuilder: (context,imageProvider)=> Container(
decoration: BoxDecoration(
image:DecorationImage(
image: imageProvider,
fit: BoxFit.cover
)
),
),
placeholder: (context, url) =>
const CircularProgressIndicator(),
errorWidget: (context, url, error) => const Icon(Icons.error),
),
),
);

[netgfx]

@aaironman Can you try without the decoration? And basically without the image builder altogether.

[aaironman]

@netgfx It doesn't work for me.Like this:
return Container(
height: 80,
width: 80,
child: ClipRRect(
borderRadius: BorderRadius.circular(6.0),
child: CachedNetworkImage(
imageUrl: imgUrl,
placeholder: (context, url) => CircularProgressIndicator(),
errorWidget: (context, url, error) => Icon(Icons.error),
),
),
);

[netgfx]

It should really, because it doesn't need the image builder, the simplest example is:

CachedNetworkImage(
       imageUrl: "http://via.placeholder.com/350x150",
       progressIndicatorBuilder: (context, url, downloadProgress) => 
               CircularProgressIndicator(value: downloadProgress.progress),
       errorWidget: (context, url, error) => Icon(Icons.error),
    ),

but does it throw the 404 error?

[kauaicreative]

I'm using cached_network_image: ^2.3.0-beta.1 which I believe will be soon released and I no longer get the error @kauaicreative

I am testing cached_network_image: ^2.3.0-rc and it's still throwing a HttpExceptionWithStatus error
HttpException: Invalid statusCode: 404, uri = https://www.gravatar.com/avatar/35f7368e9a25b5eaf00804c65b96296b.png?s=1080&d=404&

Here is my code:

CachedNetworkImage(
          imageUrl: locator<AuthService>().userImage,
          placeholder: (context, url) => MyIcon(),
          errorWidget: (context, url, error) => MyIcon(),
          fit: BoxFit.cover,
        ),

[raphaaugustosilva]

Why is this closed? Is still happening, even with ^2.3.0-beta.1+1

[uzumaki258]

it still happened. I am on version cached_network_image 2.3.1
Flutter 1.20.2

[raphaaugustosilva]

@ssbaval could you please reopen this issue?

[renefloor]

@raphaaugustosilva can you give me a small piece of code to reproduce the issue? For example the example url that @kauaicreative gives also results in a 404 when used in the browser.

When giving a 404 the image should show the error widget. If that is not happening it is indeed a bug, but the fact that some urls are not valid is not a bug of the package.

[raphaaugustosilva]

Hi @renefloor.
I think the problem is that even with the error widget, the package is throwing an exception (not just a warning). It`s related with https://github.com/Baseflow/flutter_cached_network_image/issues/433

[uzumaki258]

I back to cached_network_image: ^2.2.0+1 this issue is gone.

[kauaicreative]

cached_network_image: ^2.3.2+1
Still throwing the error, "HttpException: Invalid statusCode: 404".
@renefloor This Exception may not be technically a bug but it is annoying when developing.
If a CachedNetworkImage errorWidget exists the exception should not be thrown. The errorWidget should simply be shown.

[jeneena-jose]

Having same issue on cached_network_image: ^2.3.2+1 with Flutter 1.20.4

This happens when I have a number of 404 image urls and I scroll too fast and move up in a list. Its very annoying otherwise the package is pretty cool!

Please provide a fix as soon as possible !

[vytautas-pranskunas-]

I am having same issue too. This issue is happening for a very long tme but still it exsists.

[vytautas-pranskunas-]

But I noticed that this issue was gone until I have updated to latest flutter version. I will try to downgrade in upcoming days to check.

[renefloor]

This happens when I have a number of 404 image urls and I scroll too fast and move up in a list. Its very annoying otherwise the package is pretty cool!

What happens exactly? Do you just get the 404 in the logs, or does the app crash/freeze?

[vytautas-pranskunas-]

I am getting this also without scrolling. Flutter console just reports 400
as an error and image does not appear

[vytautas-pranskunas-]

I found an issue. For me it was that i was sending Beare header to s3 and it was deying it. So i added condition that for auth headers would not be sent to external urls.

[khangpt]

I still got this issue on flutter 1.20.4, cached_network_image 2.3.2+1.
My app was ran in debug mode

This is how my code was operated:

The app will raise this exception (file: web_helper.dart):

After that, it continue calling errorWidget (I saw this log in console)

Hope you will fix it soon

[UnicornsOnLSD]

I get a similar error even with Flutter's Image.network. It looks like it may be an issue with Flutter, which explains why this issue has come back.

[renefloor]

Yes, that's not really an error, it is also I/flutter with the I of info in the logs. That the debugger stops when running in debug is an issue with the dart vm, see for example also this question: https://stackoverflow.com/a/56881920/2999543

The try/catch is within the Flutter framework, so that's not really anything we can solve.

[ponyo877-debug]

please reopen

[renefloor]

@ponyo877-debug why should it be reopened? The dart vm bug is unrelated to this library, so it cannot be fixed here. We should only keep issues open that should be fixed here.

[netojose]

@renefloor is correct. I having crashes debugging, but after generate an APK, everything work as expected on phone.

[Radical-Daniel]

Hi, I was experiencing this issue when using a StreamBuilder on one page of my TabBarView. I would get http error saying 403. My StreamBuilder located in the 1st tab would update when someone selects a user shown in my 2nd tab and then clicks an "Add" button. I fixed it by putting each tab into separate dart files and then calling those on a third dart file containing only the TabBar.

Other than that specific circumstance I wouldn't get this error.