如何让websocket流广播到多个其他页面?

问题描述 投票:0回答:4

我正在监听一个 websocket 流:

widget.channel.stream.listen((data) {
  print("!!!!new msg: $data");
  var dataJson = json.decode(data);
  print(dataJson["content"]);
  // do my job
  setState(() {
    _allAnimateMessages.insert(0, newMsg);
  });
  newMsg.animationController.forward();
});

但是,当再次进入该页面时,出现错误:


Bad state: Stream has already been listened to.

如何使其成为广播并且其他页面可以收到该广播?

websocket stream dart flutter
4个回答
8
投票

web_socket_channel的解决方案:

final channel = IOWebSocketChannel.connect(socketUrl);
final streamController = StreamController.broadcast();
streamController.addStream(channel.stream);

之后只需使用

streamController.stream
来监听 Web 套接字事件。


4
投票

您可以使用广播。

 //Here is the solution
 StreamController<String> streamController = new StreamController.broadcast();   //Add .broadcast here

//Now you can listen from various places
@override
void initState() {
  super.initState();

  print("Creating a StreamController...");
  //First subscription
  streamController.stream.listen((data) {
    print("DataReceived1: " + data);
  }, onDone: () {
    print("Task Done1");
  }, onError: (error) {
    print("Some Error1");
  });
  //Second subscription
  streamController.stream.listen((data) {
    print("DataReceived2: " + data);
  }, onDone: () {
    print("Task Done2");
  }, onError: (error) {
    print("Some Error2");
  });

  streamController.add("This a test data");
  print("code controller is here");

}

字体:https://medium.com/@ayushpguptaapg/using-streams-in-flutter-62fed41662e4

使用广播时,您可以在同一个流中拥有多个侦听器。

如果你只是使用一个没有“.broadcast()”的流,你只能有一个监听器


0
投票

由于没有有用的答案,我在这里更新我的答案以供其他参考。

  1. 重复订阅流是 flutter 中的理想行为。

如果您只使用 StreamBuilder,则流只能监听一次。想想看,如果您的流可以监听许多其他页面或小部件,那么数据就会重复。

  1. 但是如果您想使用一个流,并更新所有小部件

当开发一个复杂的应用程序时,确实可能会发生这种情况,例如,您正在构建一个聊天应用程序,新消息来了,您应该更新许多页面UI(您的对话框聊天UI,您的会话列表UI....),然后你应该在很多页面订阅这个流,我仍然没有找到合适的方法来做到这一点,除了让这个流被广播,然后做你的工作。


0
投票

[Blockquote][1]

[1]:

<!DOCTYPE html>
<html>
<body>

<h1>The ol element</h1>

<ol>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>

<ol start="50">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>
 
</body>
</html>

© www.soinside.com 2019 - 2024. All rights reserved.