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

Question

The following ArgumentError was thrown resolving an image codec: Invalid argument(s): No host specified in URI file:///null

When the exception was thrown, this was the stack: #0 _HttpClient._openUrl (dart:_http/http_impl.dart:2636:9) #1 _HttpClient.getUrl (dart:_http/http_impl.dart:2565:48) #2 NetworkImage._loadAsync (package:flutter/src/painting/_network_image_io.dart:89:59) #3 NetworkImage.load (package:flutter/src/painting/_network_image_io.dart:50:14) #4 ImageProvider.resolveStreamForKey. (package:flutter/src/painting/image_provider.dart:503:13) ... Image provider: NetworkImage("null", scale: 1.0) Image key: NetworkImage("null", scale: 1.0)

Code:

import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';
import 'package:your_store/widgets/custom_action_bar.dart';
import 'package:your_store/widgets/product_cart.dart';

class HomeTab extends StatelessWidget {
  final CollectionReference _productRef =
  FirebaseFirestore.instance.collection("Products");

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Stack(
        children: [
          FutureBuilder<QuerySnapshot>(
            future: _productRef.get(),
            builder: (context, snapshot) {
              if (snapshot.hasError) {
                return Scaffold(
                  body: Center(
                    child: Text("Error: ${snapshot.error}"),
                  ),
                );
              }

              // Collection Data ready to display
              if (snapshot.connectionState == ConnectionState.done) {
                //Display data in List View
                return ListView(
                  padding: EdgeInsets.only(
                    top: 108.0,
                    bottom: 12.0,
                  ),
                  children:
                  snapshot.data!.docs.map((QueryDocumentSnapshot document) {
                    // Map<String, dynamic> data = document.data();
                    final dynamic data = document.data();

                    return ProductCart(
                      title: data["name"],
                      imageUrl: data["images"[0]],
                      price: "₹${data["price"]}",
                      productId: document.id,
                    );
                  }).toList(),
                );
              }

              // Loading State
              return Scaffold(
                body: Center(
                  child: CircularProgressIndicator(),
                ),
              );
            },
          ),
          CustomActionBar(
            title: "Home",
            hasBackArrow: false,
          ),
        ],
      ),
    );
  }
}

Probably data["images"[0]] is having null value which is causing the error. — TheAlphamerc
could you please check my code and tell me the possible fix? Here is the code link. github.com/Bhaskar2510/Final — Bhaskar2510

TheAlphamerc TheAlphamerc · Accepted Answer · 2021-07-21T05:23:15

@Bhaskar2510 While fetching the product it may be possible that in any product the image link is broken or null so you have to add a null check before passing it to the image widget.

Replace below code at ProductCart

Container(
  height: 350.0,
  child: ClipRRect(
    borderRadius: BorderRadius.circular(12.0),
    child: Image.network(
      "$imageUrl",
      fit: BoxFit.contain,
    ),
  ),
),

With

Container(
  height: 350.0,
  child: ClipRRect(
    borderRadius: BorderRadius.circular(12.0),
    child: imageUrl == null ? Placeholder()
     : Image.network(
      "$imageUrl",
      fit: BoxFit.contain,
    ),
  ),
)

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

1 Answers

Replace below code at ProductCart

With