Socket.io 客户端在指定路径服务器选项时未连接到服务器

Question

我有一个express 4服务器，我正在尝试与Socket.IO集成。

如果我在服务器上io.attach(serverInstance)并使用socket.io-client在 react 客户端上io.connect("http://localhost:3002")，则建立连接并且服务器会记录类似socket connection active, id: 3IjhKYkpY19D6nWHAAAB, client ip: ::ffff:127.0.0.1的内容。

但是当我{path: "/socket/socket.io"}传递为io.attach(serverInstance, {path: "/socket/socket.io"})并且io.connect("http://localhost:3002", {path: "/socket/socket.io"})没有记录任何内容时，即没有建立连接。我最近开始学习socket.io所以我知道的不多。

我希望传入的套接字连接应该在localhost:3002/socket而不是localhost:3002/请求。

服务器端：

class SocketInterface {
constructor() {
this.server = undefined; // will hold the server instance once defined.
this.io = socket(); // referencing socket interface.
this.getServerReference = this.getServerReference.bind(this);
this.ioDotOn = this.ioDotOn.bind(this);
}
/**
* this method defines the sever reference once the server starts.
* @param {http.Server} server: reference to the http server.
*/
getServerReference(server) {
this.server = server;
this.io.attach(server, {path: "/socket/socket.io"});
}
/**
* this method executes io.on()
*/
ioDotOn() {
if (this.server) {
this.io.on("connection", socket => {
// when connection is established
const ip =
socket.handshake.headers["x-forwarded-for"] ||
socket.conn.remoteAddress;
console.log(
`socket connection active, id: ${socket.id}, client ip: ${ip}`
);
// when connection breaks
socket.on("disconnect", () => {
console.log("user gone");
});
});
} else throw new Error("Server is undefined");
}
}

我需要这个类server.js

const socketInterface = require("./socket/socket-io");
let server = undefined;
// first connect to local db.
MongoInterface.mongoConnect(err => {
if (err) {
// if error, occurs terminate.
console.log(err);
process.exit(1);
} else {
// if connected to MongoDB, get a reference to the taskDbOps singleton object.
console.log("Connected to MongoDB server");
// start the server and store a reference to the server.
server = app.listen(config.PORT, err => {
if (err) console.log(err);
else console.log("Application Server Running on Port: ", config.PORT);
});
// starting the socket interface.
if (server) {
socketInterface.getServerReference(server);
socketInterface.ioDotOn(); // socket service.
}
}
});

反应客户端 这是一个模拟客户端，具有套接字连接的api.js，如下所示：api.js

import io from "socket.io-client";
function x() {
const socketConn = io.connect("http://localhost:3002", {
path: "/socket/socket.io"
});
}
export { x };

这是在app.js中导入的，如下所示：

import React from "react";
import { x } from "./api";
import logo from "./logo.svg";
import "./App.css";
function App() {
x(); //connecting to socket
return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<p>
Edit <code>src/App.js</code> and save to reload.
</p>
<a
className="App-link"
href="https://reactjs.org"
target="_blank"
rel="noopener noreferrer"
>
Learn React
</a>
</header>
</div>
);
}
export default App;

我正在使用socket.io 2.3

谢谢

Answer 1

const socketInterface = require("./socket/socket-io");
// first connect to local db.
MongoInterface.mongoConnect(err => {
if (err) {
// if error, occurs terminate.
console.log(err);
process.exit(1);
} else {
// if connected to MongoDB, get a reference to the taskDbOps singleton object.
console.log("Connected to MongoDB server");
// start the server and store a reference to the server.
// binding the server variable here resolves the problem
let server = app.listen(config.PORT, err => {
if (err) console.log(err);
else console.log("Application Server Running on Port: ", config.PORT);
});
// starting the socket interface.
if (server) {
socketInterface.getServerReference(server);
socketInterface.ioDotOn(); // socket service.
}
}
});