node.js - Flutter socket.io 连接到 Nodejs socket.io

Question

这是我的服务器

class ChatbotServer {
  private http: Server;
  private io: socketIo.Server;

  constructor(app: express.Application, private nluService: NluService, private loggerService: LoggerService) {
    this.http = createServer(app);
    this.io = socketIo(this.http);

    this.setupSocketIo();
  }

  private setupSocketIo() {
    this.io.on("connection", socket => {
      new ChatSocketConnection(socket, this.nluService, this.loggerService);
    });
  }

  listen() {
    this.http.listen(port, () => console.log(`socket.io listening on port ${port}`));
  }
}

这是我的 flutter 客户端

class MySocketApp extends StatefulWidget {
  @override
  _MySocketAppState createState() => _MySocketAppState();
}

enum ConnectionStatus { connected, disconnected }

class _MySocketAppState extends State<MySocketApp> {
  SocketIOManager manager = SocketIOManager();
  SocketIO socket;
  var status = ConnectionStatus.disconnected;



  @override
  void initState() {
    super.initState();
    setupSocketConnections();
  }

  void disconnectSocketConnections() async {
    await manager.clearInstance(socket);
    status = ConnectionStatus.disconnected;
    print("disconnected");
  }
  void setupSocketConnections() async {
    print("asd");

    socket = await manager.createInstance(SocketOptions('http://localhost:3001/'));
    socket.onConnect((data) {
      status = ConnectionStatus.connected;
      print("connected...");
    });
    socket.onConnectError((data) {
      print("Connection Error");
    });
    socket.onConnectTimeout((data) {
      print("Connection Timed Out");
    });
    socket.connect();
  }

我按照 adhara_socket_io pub 中的教程和示例进行操作，但仍然无法连接套接字。我有一个关于 react 的网络应用程序，并且套接字连接没有任何问题。这意味着服务器端没问题，所以可能我在 flutter 部分遗漏了一些东西。如果有人有任何线索，我将不胜感激!

Answer 1

使用socket_io_client而不是adhara_socket_io。

在 pubspec.yaml 文件中添加包 socket_io_client: ^0.9.4 和 flutter_simple_dependency_injection: ^1.0.1

您可以创建像下面的代码这样的单例服务(以避免类的多个实例):

import 'package:socket_io_client/socket_io_client.dart' as IO;
import 'package:tiche_flutter/config.dart';

class SocketService {
  IO.Socket socket;

  createSocketConnection() {
    socket = IO.io(config.socketUrl, <String, dynamic>{
      'transports': ['websocket'],
    });

    this.socket.on("connect", (_) => print('Connected'));
    this.socket.on("disconnect", (_) => print('Disconnected'));
  }
}

创建文件dependecy_injection.dart

class DependencyInjection {
  Injector initialise(Injector injector) {
    injector.map<SocketService>((i) => SocketService(), isSingleton: true);
    return injector;
  }
}

创建文件app_initializer.dart

import 'package:flutter_simple_dependency_injection/injector.dart';
class AppInitializer {
  initialise(Injector injector) async {}
}

添加到您的 main.dart

Injector injector;
void main() async {
  DependencyInjection().initialise(Injector.getInjector());
  injector = Injector.getInjector();
  await AppInitializer().initialise(injector);
  runApp(MyApp());
}

您需要运行 createSocketConnection 函数来在 dart 文件中创建连接。因此，在您的文件中编写代码:

final SocketService socketService = injector.get<SocketService>();
socketService.createSocketConnection();

如果套接字连接已创建，您将在终端中看到“已连接”

这对我有用。