Flutter — Firebase crash report because of “Connection closed before full header was received”

Hello everyone,

“At Wheelseye, we encountered a strange issue in Firebase Crashlytics when loading images from the network. This problem significantly impacted our Crash Free User Metric. The approach we implemented to resolve this issue is outlined below, as all other solutions mentioned on the internet failed to solve the problem.”

When it comes to loading images from the network using Image.network() or cached_network_image, you may encounter exceptions that are reported as fatal crashes in Firebase Crashlytics. It's important to note that these crashes are actually non-fatal, and accurately marking them is essential for maintaining an authentic crash-free percentage for your users.

Follow these steps to properly mark these crashes as non-fatal in the Crashlytics dashboard:

So now we are going to discuss how to mark these crash as non fatal in Crashlytics dashboard.

Step 1: Begin by importing the http library in your pubspec.yaml file.

http: ^1.1.0

Step 2: In your main file where Firebase is set up, make the following adjustments to record non-fatal exceptions.

await Firebase.initializeApp();
FlutterError.onError = (errorDetails) {
  FirebaseCrashlytics.instance.recordFlutterError(errorDetails,
      fatal: !(errorDetails.exception is HttpException ||
          errorDetails.exception is SocketException ||
          errorDetails.exception is HandshakeException ||
          errorDetails.exception is ClientException));
};

Here, we are explicitly marking HttpException, SocketException, HandshakeException, and ClientException as non-fatal.

Result

Happy coding!
Mohit Gupta
Flutter Developer
GitHub Profile

Source Code:

import 'dart:io';
import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_crashlytics/firebase_crashlytics.dart';
import 'package:flutter/material.dart';
import 'package:http/http.dart';

void main() async {
  await Firebase.initializeApp();
  FlutterError.onError = (errorDetails) {
    FirebaseCrashlytics.instance.recordFlutterError(errorDetails,
        fatal: !(errorDetails.exception is HttpException ||
            errorDetails.exception is SocketException ||
            errorDetails.exception is HandshakeException ||
            errorDetails.exception is ClientException));
  };
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key});

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Image.network(''),
      ),
    );
  }
}