我如何在 Flutter web 中使用套接字

Question

我正在尝试在使用 socketio 用 Python 编写的套接字服务器与使用 Flutter Web 创建的客户端之间建立连接。

我测试了 adhara_socket_io and flutter_socket_io 等各种套接字包，但没有任何效果。我在 Android 上尝试了相同的代码片段，但它们也没有用。

我一直在搜索，我找到了这段代码。它使用 dart.io 包中的 Socket class。

Socket socket = await Socket.connect('192.168.2.190', 7003);

    print('connected');

    // listen to the received data event stream
    socket.listen((List<int> event) {
      print(utf8.decode(event));
    });

    // send hello
    socket.add(utf8.encode('hello'));

    // wait 5 seconds
    await Future.delayed(Duration(seconds: 5));

    // .. and close the socket
    socket.close();

这个连接到 Python 服务器并从 Android 发送数据但是当我从 Web 测试它时我没有连接。

是否需要添加一些额外的东西才能在 Web 上运行？

或者在最坏的情况下，是否有另一种方法可以做我想做的事情，我的目标是在网站上显示视频源。该视频实际上是从 Python 拍摄的一堆图像，将对它们执行一些机器学习，我想通过套接字发送它们，每张图像都会在收到后立即显示，所以它看起来像视频源。（使用 React 完成了类似的事情）

Answer 1

dart.io 包与 flutter web 不兼容。我想正如 pskink 所建议的那样，websockets 是可行的方法。您可以使用 web_socket_channel package as documented here 中的 HtmlWebSocketChannel。我已经使用了这个包，可以确认它在 flutter web 中运行良好。

在你的情况下应该使用如下内容。

var channel = HtmlWebSocketChannel.connect("ws://192.168.2.190:7003");

但请注意，这不能与常规的 Flutter 应用互操作。如果您的目标是同时针对 android 和 flutter web，那么您应该根据您为其构建的目标有条件地处理此通道创建，并在 HtmlWebSocketChannel 或 IOWebSocketChannel 之间做出决定以创建连接。如果您有兴趣，可以使用 *.

中建议的基于条件存根的实现

* 注意：这是我的 post。 :)

我如何在 Flutter web 中使用套接字

How can i use sockets with Flutter web

sockets

flutter

flutter-web