Question 76834 in Flutter Question posted in
The official Flutter documentation can be found here.

404 Error Handling in Cached Networked Images – Flutter

So i wanted to create a card with an image. I fetched the data and stored it in my news map with key urlToImage as my image url. Its working all fine but when a url such as

https://i-invdn-com.investing.com/news/https://i-invdn-com.investing.com/akapi-images/800×450/59149e84fbd2b771f1b6adea95d99dd6_w_800_h_450.jpg

where resource isn’t found (404 error).
My app crashes.

here is the log image of the error:

error log

error log

I’m new to flutter and dart so can someone help me learn how to handle this case?

This is my CachedNetworkImage widget.


          CachedNetworkImage(
            imageUrl: news['urlToImage'] ?? NewsConstants.errorImage,
            progressIndicatorBuilder: (context, url, downloadProgress) =>
                CircularProgressIndicator(value: downloadProgress.progress),
            errorWidget: (context, url, error) => const Icon(Icons.error),
          )

I have tried using error widget but it doesn’t help either

Tags:

2

Answers


  1. 0

    I think that the url is broken. It looks like url String is created from 2 separate urls. Probably you will need to remove starting part of it (https://i-dndvn-com.investing.com/news/)

    https://i-dndvn-com.investing.com/news/https://i-invdn.invetinga.com/akapi..

    Login or Signup to reply.
  2. 0

    I wanted to copy this url you are using "https://i-invdn-com.investing.com/news/https://i-invdn-com.investing.com/akapi-images/800×450/59149e84fbd2b771f1b6adea95d99dd6_w_800_h_450.jpg" But it gave 404 back because there was no picture.

    But when I used "https://i-invdn-com.investing.com/akapi-images/800×450/59149e84fbd2b771f1b6adea95d99dd6_w_800_h_450.jpg" everything was fine.

    If you always pull the saddle message from the same URL then use it like news[‘urlToImage’].toString().substring(39)

    CachedNetworkImage(
            imageUrl: news['urlToImage'].toString().substring(39) 
?? 
NewsConstants.errorImage,
            progressIndicatorBuilder: (context, url, 
downloadProgress) =>
                CircularProgressIndicator(value: 
downloadProgress.progress),
            errorWidget: (context, url, error) => const 
Icon(Icons.error),
          )
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search