How to connect flutter Web_socket_channel package with Django Channels?

Question

I want to connect the web_socket_channel package of Flutter with Django channel. My application is perfectly communicating using Django Template and Redis server. I want to use flutter package so that I can use this with flutter application.

Django Channel Django API is using the following route:

 application = ProtocolTypeRouter({
    'websocket': AuthMiddlewareStack(

        URLRouter([
            path('ws/chat/<str:room_name>/', consumers.ChatConsumer)
        ])
    ),
 })

JS WebSocket: My Django Template is using the following url path to connect websocket:

 const chatSocket = new WebSocket(
            'ws://'
            + window.location.host
            + '/ws/chat/'
            + roomName
            + '/'
        );

Flutter: I've tried the following code with flutter to connect to Django Channel but failed.

  void startSocket() async {
    final channel = IOWebSocketChannel.connect('ws://$baseUrl/ws/chat/hello/');
    channel.stream.listen(
      (event) {
        channel.sink.add('Received!');
        channel.sink.close(status.goingAway);
      },
    );
  }

I've seen some other peoples queries on the same topic and add the following permission to the AndroidMenifest.xml

<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<uses-permission android:name="android.permission.INTERNET"/>

but flutter still it show the following errors:

    E/flutter ( 4901): [ERROR:flutter/lib/ui/ui_dart_state.cc(177)] Unhandled Exception: WebSocketChannelException: WebSocketChannelException: SocketException: Failed host lookup: 'http' (OS Error: No address associated with hostname, errno = 7)
    E/flutter ( 4901): #0      new IOWebSocketChannel._withoutSocket.<anonymous closure>
    package:web_socket_channel/io.dart:84
    E/flutter ( 4901): #1      _invokeErrorHandler (dart:async/async_error.dart:16:24)
    E/flutter ( 4901): #2      _HandleErrorStream._handleError (dart:async/stream_pipe.dart:282:9)
    E/flutter ( 4901): #3      _ForwardingStreamSubscription._handleError (dart:async/stream_pipe.dart:161:13)
    E/flutter ( 4901): #4      _rootRunBinary (dart:async/zone.dart:1214:47)
    E/flutter ( 4901): #5      _CustomZone.runBinary (dart:async/zone.dart:1107:19)
    E/flutter ( 4901): #6      _CustomZone.runBinaryGuarded (dart:async/zone.dart:1013:7)
    E/flutter ( 4901): #7      _BufferingStreamSubscription._sendError.sendError (dart:async/stream_impl.dart:376:15)
    E/flutter ( 4901): #8      _BufferingStreamSubscription._sendError (dart:async/stream_impl.dart:394:16)
    E/flutter ( 4901): #9      _BufferingStreamSubscription._addError (dart:async/stream_impl.dart:294:7)
    E/flutter ( 4901): #10     _SyncStreamControllerDispatch._sendError (dart:async/stream_controller.dart:812:19)
    E/flutter ( 4901): #11     _StreamController._addError (dart:async/stream_controller.dart:690:7)
    E/flutter ( 4901): #12     _rootRunBinary (dart:async/zone.dart:1214:47)
    E/flutter ( 4901): #13     _CustomZone.runBinary (dart:async/zone.dart:1107:19)
    E/flutter ( 4901): #14     _CustomZone.runBinaryGuarded (dart:async/zone.dart:1013:7)
    E/flutter ( 4901): #15     _BufferingStreamSubscription._sendError.sendError (dart:async/stream_impl.dart:376:15)
    E/flutter ( 4901): #16     _BufferingStreamSubscription._sendError (dart:async/stream_impl.dart:394:16)
    E/flutter ( 4901): #17     _BufferingStreamSubscription._addError (dart:async/stream_impl.dart:294:7)
    

    E/flutter ( 4901): #18     _SyncStreamControllerDispatch._sendError (dart:async/stream_controller.dart:812:19)
    E/flutter ( 4901): #19     _StreamController._addError (dart:async/stream_controller.dart:690:7)
    E/flutter ( 4901): #20     new Stream.fromFuture.<anonymous closure> (dart:async/stream.dart:178:18)
    E/flutter ( 4901): #21     _rootRunBinary (dart:async/zone.dart:1214:47)
    E/flutter ( 4901): #22     _CustomZone.runBinary (dart:async/zone.dart:1107:19)
    E/flutter ( 4901): #23     _FutureListener.handleError (dart:async/future_impl.dart:157:20)
    E/flutter ( 4901): #24     Future._propagateToListeners.handleError (dart:async/future_impl.dart:708:47)
    E/flutter ( 4901): #25     Future._propagateToListeners (dart:async/future_impl.dart:729:24)
    E/flutter ( 4901): #26     Future._completeError (dart:async/future_impl.dart:537:5)
    E/flutter ( 4901): #27     Future._asyncCompleteError.<anonymous closure> (dart:async/future_impl.dart:593:7)
    E/flutter ( 4901): #28     _rootRun (dart:async/zone.dart:1190:13)
    E/flutter ( 4901): #29     _CustomZone.run (dart:async/zone.dart:1093:19)
    E/flutter ( 4901): #30     _CustomZone.runGuarded (dart:async/zone.dart:997:7)
    E/flutter ( 4901): #31     _CustomZone.bindCallbackGuarded.<anonymous closure> (dart:async/zone.dart:1037:23)
    E/flutter ( 4901): #32     _microtaskLoop (dart:async/schedule_microtask.dart:41:21)
    E/flutter ( 4901): #33     _startMicrotaskLoop (dart:async/schedule_microtask.dart:50:5)
    E/flutter ( 4901):
    D/EGL_emulation( 4901): eglMakeCurrent: 0xe87859c0: ver 2 0 (tinfo 0xe8783df0)
    E/BufferQueueProducer( 4901): [SurfaceTexture-0-4901-3] cancelBuffer: BufferQueue has been abandoned

The request is not even hitting the backend api get way.

Answer 1

等待大神答复