Baseflow / flutter_cached_network_image

Download, cache and show images in a flutter app
https://baseflow.com
2.44k stars 655 forks source link

HttpException: No valid statuscode. #273

Closed ssbaval closed 4 years ago

ssbaval commented 4 years ago

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 commented 4 years ago

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

guillaumeprevost commented 4 years ago

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:

Cheers!

dspoonia7 commented 4 years ago

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

renefloor commented 4 years ago

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

vanlooverenkoen commented 4 years ago

We should be able to handle the errors ourselves.

phpirate commented 4 years ago

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 commented 4 years ago

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

renefloor commented 4 years ago

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

vanlooverenkoen commented 4 years ago

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 commented 4 years ago

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

vanlooverenkoen commented 4 years ago

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

netgfx commented 4 years ago

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

renefloor commented 4 years ago

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

netgfx commented 4 years ago

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 commented 4 years ago

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 commented 4 years ago

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 commented 4 years ago

@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 commented 4 years ago

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 commented 4 years ago

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 commented 4 years ago

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 commented 4 years ago

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 commented 4 years ago

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

kauaicreative commented 4 years ago

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 commented 4 years ago

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 commented 4 years ago

@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 commented 4 years ago

@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 commented 4 years ago

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

netgfx commented 4 years ago

@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 commented 4 years ago

@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 commented 4 years ago

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

aaironman commented 4 years ago

@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 commented 4 years ago

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 commented 4 years ago

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 commented 4 years ago

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

uzumaki258 commented 4 years ago

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

raphaaugustosilva commented 4 years ago

@ssbaval could you please reopen this issue?

renefloor commented 4 years ago

@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 commented 4 years ago

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 commented 4 years ago

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

kauaicreative commented 4 years ago

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 commented 4 years ago

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- commented 4 years ago

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

vytautas-pranskunas- commented 4 years ago

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 commented 4 years ago

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- commented 4 years ago

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

image

vytautas-pranskunas- commented 4 years ago

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 commented 4 years ago

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: freesnippingtool com_capture_20201002113243

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

freesnippingtool com_capture_20201002112225

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

Hope you will fix it soon

jmshrv commented 3 years ago

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 commented 3 years ago

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.

ghost commented 3 years ago

please reopen