flutter websocket connection issue

Question

I am trying to develop a flutter app which connects to the server and exchanges data using websocket. The server is in .Net Core and using Asp.Net Core Websockets to implement this functionality.

The problem I am facing is, my flutter app is not able to connect to the server and throws following error.

E/flutter (31498): [ERROR:topaz/lib/tonic/logging/dart_error.cc(16)] Unhandled exception:
E/flutter (31498): WebSocketChannelException: WebSocketChannelException: WebSocketException: Connection to 'http://127.0.0.1/client#' was not upgraded to websocket
E/flutter (31498): #0      new IOWebSocketChannel._withoutSocket.<anonymous closure> (package:web_socket_channel/io.dart:83:24)
E/flutter (31498): #1      _invokeErrorHandler (dart:async/async_error.dart:13:29)
E/flutter (31498): #2      _HandleErrorStream._handleError (dart:async/stream_pipe.dart:286:9)
E/flutter (31498): #3      _ForwardingStreamSubscription._handleError (dart:async/stream_pipe.dart:168:13)
E/flutter (31498): #4      _RootZone.runBinaryGuarded (dart:async/zone.dart:1328:10)
E/flutter (31498): #5      _BufferingStreamSubscription._sendError.sendError (dart:async/stream_impl.dart:350:15)
E/flutter (31498): #6      _BufferingStreamSubscription._sendError (dart:async/stream_impl.dart:367:16)
E/flutter (31498): #7      _BufferingStreamSubscription._addError (dart:async/stream_impl.dart:266:7)
E/flutter (31498): #8      _SyncStreamController._sendError (dart:async/stream_controller.dart:767:19)
E/flutter (31498): #9      _StreamController._addError (dart:async/stream_controller.dart:647:7)
E/flutter (31498): #10     _RootZone.runBinaryGuarded (dart:async/zone.dart:1328:10)
E/flutter (31498): #11     _BufferingStreamSubscription._sendError.sendError (dart:async/stream_impl.dart:350:15)
E/flutter (31498): #12     _BufferingStreamSubscription._sendError (dart:async/stream_impl.dart:367:16)
E/flutter (31498): #13     _BufferingStreamSubscription._addError (dart:async/stream_impl.dart:266:7)
E/flutter (31498): #14     _SyncStreamController._sendError (dart:async/stream_controller.dart:767:19)
E/flutter (31498): #15     _StreamController._addError (dart:async/stream_controller.dart:647:7)
E/flutter (31498): #16     new Stream.fromFuture.<anonymous closure> (dart:async/stream.dart:110:18)
E/flutter (31498): #17     _RootZone.runBinary (dart:async/zone.dart:1386:54)
E/flutter (31498): #18     _FutureListener.handleError (dart:async/future_impl.dart:141:20)
E/flutter (31498): #19     Future._propagateToListeners.handleError (dart:async/future_impl.dart:649:47)
E/flutter (31498): #20     Future._propagateToListeners (dart:async/future_impl.dart:670:24)
E/flutter (31498): #21     Future._completeError (dart:async/future_impl.dart:489:5)
E/flutter (31498): #22     Future._asyncCompleteError.<anonymous closure> (dart:async/future_impl.dart:537:7)
E/flutter (31498): #23     _microtaskLoop (dart:async/schedule_microtask.dart:41:21)
E/flutter (31498): #24     _startMicrotaskLoop (dart:async/schedule_microtask.dart:50:5)

Important thing here is, the app is able to connect to other websocket servers. It can also connect to other prototype servers that I developed for testing on the same machine.

The .Net core server is also very functional and I can connect a browser easily to the server and communicate with it.

The problem just arises only when I try to connect a flutter app to a .Net core websocket server.

I am using the default template app for testing. Here is the code of my MyHomePage class

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);
  final channel = new IOWebSocketChannel.connect("ws://192.168.1.139/client");

Here is the _MyHomePageState implementation

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

initState() {
        super.initState();
        widget.channel.stream.listen(this.onData, onError: onError, onDone: onDone);

    (() async {
      setState(() {

      });
    });
  }

  onDone(){
    debugPrint("Socket is closed");
  }

  onError(err){
    debugPrint(err.runtimeType.toString());
    WebSocketChannelException ex = err;
    debugPrint(ex.message);
  }

  onData(event){
    debugPrint(event);
  }

which always results in onError with following output

I/flutter ( 4608): WebSocketChannelException
I/flutter ( 4608): WebSocketChannelException: WebSocketException: Connection to 'http://18.217.117.92/client#' was not upgraded to websocket
I/flutter ( 4608): Socket is closed

I understand it has to do something with how dart websocket package perform the handshake with server but not able to pin point the issue.

Can anyone please figure out what exactly is wrong here ?

Solution

I hope this will help many though the issue is no longer relevant. The problem is with .Net core websocket implementation.

With some research and after analyzing the Wireshark log, I could realize that somehow .Net core expected the websocket protocol update headers in specific format (i.e. the implementation was case sensitive) this is true for .Net core framework 2.1. However, the problem was immediately fixed in the next release. I switched to beta and the issue was fixed. I consulted both Flutter developers as well as .Net core team regarding this and they confirmed the same.

The current version of .Net core (at the time of answering this is 3.0 which has no such problems.

Comments

[Günter Zöchbauer]

How do you connect to the server? Please add the relevant code.

[Günter Zöchbauer]

Might be github.com/flutter/flutter/issues/11444

[Murtuza Kabul]

I have updated the code and added the missing bits. There is not much except of creation of channel and starting to listen to it. Apart from that, everything else is boilerplate code automatically generated by flutter.