Incomplete Image Loading from PHP Built-in Server on Docker to Android Emulator

66 Views Asked by At

I'm currently developing a web application using Laravel Sail (utilizing the Built-in HTTP server of PHP), which is running in a Docker container on my WSL2 host. Everything works perfectly when I access the images via http://localhost/storage/files/food.png on my host machine.

However, when I try to access the same image through an Android emulator using http://10.0.2.2/storage/files/food.png, the image often loads incompletely or with glitches. Rarely, the image loads correctly, but this seems to happen randomly. Here's an example of what the image looks like when it doesn’t load correctly:

Image with glitches

To get an error message, I've put together a basic Flutter code as follows:

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

  @override
  Widget build(BuildContext context) {
    return Image.network(
        'http://10.0.2.2/storage/files/food.png',
    );
  }
}

And I get the following error message:

======== Exception caught by image resource service ================================================
The following HttpException was thrown resolving an image codec:
Connection closed while receiving data, uri = http://10.0.2.2/storage/files/food.png

When the exception was thrown, this was the stack: 
#0      _HttpIncoming.listen.<anonymous closure> (dart:_http/http_impl.dart:442:7)
#11     _HttpParser._reportBodyError (dart:_http/http_parser.dart:1200:22)
#12     _HttpParser._onDone (dart:_http/http_parser.dart:898:9)
#20     _Socket._onData (dart:io-patch/socket_patch.dart:2454:21)
#27     new _RawSocket.<anonymous closure> (dart:io-patch/socket_patch.dart:1943:35)
#28     _NativeSocket.issueReadEvent.issue (dart:io-patch/socket_patch.dart:1372:18)
(elided 25 frames from dart:async)
Image provider: NetworkImage("http://10.0.2.2/storage/files/food.png", scale: 1.0)
Image key: NetworkImage("http://10.0.2.2/storage/files/food.png", scale: 1.0)
====================================================================================================

Has anyone else encountered this issue or have any suggestions on what could be causing this and how to resolve it? Any help would be greatly appreciated.

Thank you!


Update: Just to provide an update, I've conducted a test using a different Android emulator, specifically the BlueStacks App Player. Interestingly, the image loaded perfectly in this environment! This leads me to believe that the issue may lie with the Android Emulator (through QEMU).

While the BlueStacks App Player is not a permanent solution for my development needs, I'll use it temporarily until a fix is found for the original issue.

0

There are 0 best solutions below