CODEWITHSUNDEEP
firebaseflutterdartgoogle-cloud-firestorestream-builder
Siddharth
Siddharth

Reputation: 153

Invalid argument(s): No host specified in URI file:///null

GetPhotoUrlStream provide a stream of Url of Profile Photo (data['profilePhoto']) Stored in my Cloud Firebase FireStore. which then being utilized by networkimage to show the profilephoto(circular Avatar)

 class GetUserPhotoUrlStream extends StatelessWidget {
      final String documentId; // This is your User UID
    
      GetUserPhotoUrlStream(this.documentId);
    
      @override
      Widget build(BuildContext context) {
        DocumentReference users = FirebaseFirestore.instance.collection('users').doc(documentId);
        return StreamBuilder<DocumentSnapshot>(
          stream: users.snapshots(),
          builder:  (BuildContext context, AsyncSnapshot<DocumentSnapshot> snapshot) {
    
            if (snapshot.hasError) {
              return Image.asset('assets/images/NouserImage.png');
            }
    
            if (snapshot.connectionState == ConnectionState.waiting) {
              return CircularProgressIndicator();
            }
    
            Map<String, dynamic> data = snapshot.data.data();
            return  CircleAvatar(
                maxRadius: 80,
                backgroundColor: Colors.grey,
                child: ClipOval(child: FadeInImage(placeholder: AssetImage('assets/images/NouserImage.png'),image: NetworkImage("${data['profilePhoto']}"),),),
               
            );
          },
        );
      }
    }

removeUserPhotoUrl update's the 'profilePhoto' to null which is being used by GetUserPhotoUrlStream.

  Future<void> removeUserPhotoUrl(BuildContext context) async
  {
    var user = _auth.currentUser;
    DocumentReference users = FirebaseFirestore.instance.collection('users').doc(user.uid);
     users.update({'profilePhoto':null}).then((_){
      Navigator.pop(context);
    });
    await deleteUserImage(context);
    notifyListeners();
  }

when the value of data['profilePhoto'] is made null using removeUserPhotoUrl it should show me placeholder image which is Provides an assetImage rather it gives an error

Error Message

====================================================================================================

======== Exception caught by image resource service ================================================
Invalid argument(s): No host specified in URI file:///null
====================================================================================================

Also When app is HotReload or HotRestart The Error is Gone and it start Showing Me the PlaceHolder(Asset Image)

Please Help.I want to show Placeholder(Asset Image) as soon as the 'profilePhoto' becomes null

Upvotes: 1

Views: 2565

Answers (1)

Kishan Dhankecha
Kishan Dhankecha

Reputation: 1015

You need to understand first what FadeInImage Widget does,

FadeInImage(
    placeholder: AssetImage('assets/images/NouserImage.png'),
    image: NetworkImage("${data['profilePhoto']}"),
),

In a simple word what it does is it shows a Placeholder you provided as a widget to show when the actual Network Image is Loading from URL, then after when URL get a response as an Image it show to us as a Widget instead of Placeholder.

That's why when you HOT RESTART or HOT RELOAD the app whole UI gets rebuilt as well as FadeInImage widget.

WHAT IS THE PROBLEM:

======== Exception caught by image resource service ================================================
Invalid argument(s): No host specified in URI file:///null
====================================================================================================

The Message above says that there is no host Specified. That means the data or URL you get from data['profilePhoto'] return a URL with no specification of http:// or https://.

SOLUTION

YOU NEED TO MAKE SURE THAT YOU GET HOST SPECIFIED IN THE data['profilePhoto'].

Still if you want to make sure to show your Widget if URL fails you should use imageErrorBuilder property in FadeInImage as here:

FadeInImage(
  placeholder: placeholder,
  image: image, 
  imageErrorBuilder: (ctx, exception, stackTrace) {
    return Container(); //THE WIDGET YOU WANT TO SHOW IF URL NOT RETURN IMAGE
  },
)

I hope that you got my point.🙌

Upvotes: 5

Related Questions