連接上的 Socket.io 在 Flutter 上不起作用

Question

Socket.io 連接在我的顫振應用程序上不起作用。 我沒有在 index.js 文件的 io.on("connection"...) 方法中打印任何控制台日志。 為什么會這樣？ （數據庫鏈接很好）。 單擊按鈕測試連接時，它正在打印第 18 行，但沒有調用套接字發射。

我的代碼如下：

socket_client.dart

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

class SocketClient {
  IO.Socket? socket;
  static SocketClient? _instance;

  SocketClient._internal() {
    socket = IO.io('http://localhost:3000', <String, dynamic>{
      'transports': ['websocket'],
      'autoConnect': false,
    });
    socket!.connect();
  }

  static SocketClient get instance {
    _instance ??= SocketClient._internal();
    return _instance!;
  }
}

test_socket.dart

import 'package:flutter/material.dart';
import 'package:socket_tutorial/utils/socket_client.dart';

class CreateRoomScreen extends StatefulWidget {
  const CreateRoomScreen({Key? key}) : super(key: key);

  @override
  State<CreateRoomScreen> createState() => _CreateRoomScreenState();
}

class _CreateRoomScreenState extends State<CreateRoomScreen> {
  final _socketClient = SocketClient.instance.socket!;

  test() {
    print('Line 18');
    _socketClient.emit("test", "Socket Connected");
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Container(
            margin: const EdgeInsets.symmetric(
              horizontal: 20,
            ),
            child: ElevatedButton(
              onPressed: test,
              child: const Text(
                "Test Connection",
                style: TextStyle(
                  fontSize: 16,
                  color: Colors.white,
                ),
              ),
            )),
      ),
    );
  }
}

index.js

// IMPORTS
const express = require("express");
const http = require("http");
const mongoose = require("mongoose");

// create a server
const app = express();
const port = process.env.PORT || 3000;
var server = http.createServer(app);
var io = require("socket.io")(server);

// middle ware
app.use(express.json());

// connect to mongodb
const DB = "link";

// listening to socket io events from the client (flutter code)
io.on("connection", (socket) => {
  console.log(socket.id);
  socket.on("test", (data) => {
    console.log(data);
  })
  
});

mongoose
  .connect(DB)
  .then(() => {
    console.log("Connection Successful!");
  })
  .catch((e) => {
    console.log(e);
  });

// listen to server
server.listen(port, "0.0.0.0", () => {
  console.log(`Server started and running on port ${port}`);
});

Answer 1

嘗試在 initState 中調用test()

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