Flutter中WebSocket这一块主要用的是插件web_socket_channel，它主要基于 WebSocket 协议，通过该协议实现与服务器之间的双向通信；

    web_socket_channel 插件的几个主要步骤：

1 连接到WebSocket服务器:
使用 WebSocketChannel.connect 方法可以连接到指定的 WebSocket 服务器。这个方法接受一个 URI 参数，返回一个 WebSocketChannel 对象，用于之后的通信操作。
2 监听来自服务器的消息:
通过 stream 属性监听来自服务器的消息。这个 stream 是一个 Stream 类的实例，允许以异步方式接收多个事件。在 UI 层面，可以使用 StreamBuilder 组件绑定这个 stream，并自动更新界面显示新消息。
3 将数据发送到服务器:
使用 WebSocketChannel 的 sink 对象的 add 方法向服务器发送数据。sink 是一个 StreamSink 类的实例，它提供一种方式向数据源添加事件。
4 关闭WebSocket连接:
完成通信后，通过调用 sink.close 方法关闭 WebSocket 连接，释放资源。

栗子:

class MyApp2 extends StatelessWidget {@overrideWidget build(BuildContext context) {return MaterialApp(home: HomePage2(),);}
}class HomePage2 extends StatefulWidget {@overrideState<StatefulWidget> createState() => _HomePageState();
}class _HomePageState extends State<HomePage2> {final channel = IOWebSocketChannel.connect('ws://124.222.224.186:8800');@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('Home Page'),),body: Center(child: StreamBuilder(stream: channel.stream,builder: (context,snapshot) {if(snapshot.connectionState == ConnectionState.active) {print(snapshot.data);return Container(width: double.infinity,height: 200,child: Center(child: Text('${snapshot.data}'),),);}return SizedBox(height: 100,);},),),floatingActionButton: FloatingActionButton(onPressed: _sendMessage,tooltip: 'Send message',child: Icon(Icons.send),),);}void _sendMessage() {print("send event!");channel.sink.add(jsonEncode({"event":"events","data":"Hi 007"}));}@overridevoid dispose() {channel.sink.close();super.dispose();}
}

WebSocketChannel提供了一个来自服务器的消息Stream 。该Stream类是dart:async包中的一个基础类。它提供了一种方法来监听来自数据源的异步事件。与Future返回单个异步响应不同，Stream类可以随着时间推移传递很多事件。该StreamBuilder Widget将连接到一个Stream， 并在每次收到消息时通知Flutter重新构建界面。