Random port used

[talelamira]

Hi,

I tried the example as mentionned on pub.dev but the app runs in timeout because it cannot connect to remote devtools and the used port is not the one I provided. Is this normal?

Thank you

[ciokan]

I get the same error. Did you manage to get around it?

[MichaelMarner]

How are you running your app (iOS/Android/Web/Desktop etc)

[MichaelMarner]

tl;dr - this is not a bug, the port number you are seeing in the exception is the local port, not the remote port you are trying to connect to. This exception means that Flutter could not connect to remote devtools. Either remotedev is not running, or is not listening on port 8000, or is on a different IP address, or there is some other networking issue preventing Flutter from connecting.

To help debug this further I really need to know the platform you're running Flutter on (web, iOS, Android), whether you are running on a device or a simulator, and possibly a bit more about your local network.

---

Longer explanation

OK, so this is not actually a bug, just a confusing error message coming from WebSocket.connect, as used inside socketcluster. That port number you are seeing is the local port allocated to Flutter by the OS, not the remote port you are attempting to connect to.

When any TCP connection is initiated, the operating system opens up a random port on the local device (in this case, the device the Flutter app is running on). This local port is how data gets from the remote host back to your app. And so the connection might end up being from localhost:41158 to 192.1608.0.195:8000. The local port allocated by the OS is random, and is there so that the OS can route incoming packets to the correct process (in this case, your Flutter app).

I'm not sure why the WebSocket exception is showing the local port in the exception rather than the remote one, it does seem confusing. However, you can see the connection attempt being made correctly by stepping through the connect code in the debugger`. You can see the Uri being correctly parsed from socketcluster client:

This is then converted into an HTTP URI that can be given to the HttpClient to initiate the connection:

The connection at this point should succeed. If it isn't successful you get that exception with the confusing port number. But the connection attempt is correct.

A non-exhaustive list of why it might fail to connect:

• remotedev is not running
• remotedev is running on a different port to what you expect
• remotedev is running using SSL (I haven't tested with SSL, so there may be a legitimate issue there. Please file a new issue if that's the case)
• The IP address is not correct. Note that the IP address needs to be the routable IP address of the machine running remotedev - connections to localhost won't work
• You are running on a platform that doesn't allow insecure (HTTP) connections

As I said at the top, I really need more information to help here, but as it stands this is not a bug.

[0rangeFox]

Hey again, thanks for the brief explanation, I re-inserted these tools, and out of nowhere it worked correctly, I must have forgotten something in the code or missed something, I honestly don't know. But the point is, it is working correctly.

Where I am testing is on Flutter on the mobile platform, currently Android with the "RemoteDev" server on Windows 11. With the following execution code:

void main() {
  runApp(const ExampleApp());
}

class ExampleApp extends StatefulWidget {

  const ExampleApp({Key? key}) : super(key: key);

  @override
  _ExampleAppState createState() => _ExampleAppState();

}

class _ExampleAppState extends State<ExampleApp> {

  late DevToolsStore<AppState> store;

  @override
  void initState() {
    super.initState();

    final RemoteDevToolsMiddleware<AppState> remoteDevtools = RemoteDevToolsMiddleware<AppState>('192.168.1.71:8000');
    store = DevToolsStore<AppState>(
        <Reducer>,
        initialState: <Initial State>,
        middleware: [
          <Others Middlewares>,
          remoteDevtools,
        ]
    );
    remoteDevtools.store = store;
    remoteDevtools.connect();
  }

  @override
  Widget build(BuildContext context) {

  }

}

[0rangeFox]

In my previous message, I forgot to mention that the tests are produced in the emulator and not on a physical/real device. It was as I was saying, before I was trying on a physical/real device and nothing worked correctly, so now I was doing these tests and they are not working at all even using a local IP from the Wi-Fi network, no effects. Do you have any idea what it could be?

[JuxBoxJimmy]

Just came across this issue. For anyone who is still struggling with this, I've got remote devtools working on an emulator. Since the Android emulator maps localhost to the IP address 10.0.2.2, you need to use this IP when connecting to the remote devtools server.