[Firebase Storage + Flutter Web] Failed to detect image file format using the file header

[Kuhlemann]

🐛 Bug Report

When I try to load an image with "CachedNetworkImage()" I get the following error and the image can't be visualized:

ImageCodecException: Failed to detect image file format using the file header. File header was [0x3c 0x21 0x44 0x4f 0x43 0x54 0x59 0x50 0x45 0x20]. Image source: http://localhost:49430/Shop/hHtD0QEuS2NkzWvSTUOZ/computer2.png

• The problem only appears in Flutter Web with relative URIs from Firebase Storage (fileService: FirebaseHttpFileService() is used).
• The same code works for iOS/Android.
• In the console of Firebase Storage I see that the image has the correct MIME-type "image/jpeg".
• All images which I tested (.png / .jpeg) have this problem.
• Using -web-renderer html doesn't solve the problem.
• If I use CachedNetworkImage() for the same picture from Firebase Storage with a fully qualified https-URL (instead of using FirebaseHttpFileService) then the picture is visualized correctly in Flutter Web.

Expected behavior

CachedNetworkImage should be able to visualize Firebase Storage pictures when using fileService: FirebaseHttpFileService() with relative paths.

Reproduction steps

CachedNetworkImage(
                  imageUrl: 'Shop/hHtD0QEuS2NkzWvSTUOZ/computer2.png',
                  placeholder: (context, url) => Center(child: customCircularProgressIndicator()),
                  errorWidget: (context, url, error) {
                    print(error);
                    return const Icon(Icons.close, color: MyColors.error);
                  },
                  cacheManager: CustomCacheManager(),
                ),

"imageUrl" is a relative path inside Firebase Storage.

class CustomCacheManager extends CacheManager {
  static const key = CKeys.customCacheManagerKey;

  static final CustomCacheManager _instance = CustomCacheManager._internal();

  CustomCacheManager._internal()
      : super(
          Config(
            key,
            stalePeriod: const Duration(days: 1),
            fileService: FirebaseHttpFileService(),
          ),
        );

  factory CustomCacheManager() {
    return _instance;
  }
}

Configuration

Version: cached_network_image: 3.4.0 flutter_cache_manager_firebase: 2.1.1

Platform:

• [ ] :iphone: iOS
• [ ] :robot: Android
• [X] 🖥️ Web