React + Express + socket.IO на локальном хосте не подключается - PullRequest
0 голосов
/ 20 марта 2020

Я использую React в качестве клиента с Express в качестве бэкэнда:

Приложение. js:

const [socket] = useSocket("localhost:80");

    useEffect( () => {
        socket.emit("test", "test message");
        })
    });

сервер. js:

const express = require("express");
const path = require("path");
const http = require("http")
const socketIO = require("socket.io")
const port = process.env.PORT || 80; // process... is an environment variable used by heroku

const app = express();
const server = http.createServer(app);
const io = socketIO(server);

app.use(express.static(path.join(__dirname, '../../build')));

app.get('/*', function(req, res) {
    res.sendFile(path.join(__dirname, '../../build', 'index.html'))
});

io.on("connection", socket => {
    console.log("new client");
    }
)

app.listen(port, () => console.log(`Listening on port ${port}`));

Сервер работает и обслуживает приложение, но никогда не запускает журнал, подтверждающий, что клиент был зарегистрирован. Почему он не регистрирует клиента?

РЕДАКТИРОВАТЬ: сетевая панель показывает постоянные получения (с 200) и сообщений (с 404):

Request URL:http://localhost:3000/socket.io/?EIO=3&transport=polling&t=N3uOnTh
Response: Cannot POST /socket.io/

EDIT2: эта версия работает на localhost, но я понятия не имею, почему: сервер. js

const express = require("express");
const path = require("path");
const http = require("http");
const socketIO = require("socket.io");
// localhost  server port
const port = process.env.PORT || 4001;
const app = express();

// server instance
const server = http.createServer(app);

// socket with an instance of the server
const io = socketIO(server);

io.on("connection", socket => {
    console.log("New client connected");

    socket.on("test", data => {
        console.log("test received");
        io.sockets.emit("test response", "response")
    });
});

app.use(express.static(path.join(__dirname, '../../build')));
app.get('/*', function(req, res) {
    res.sendFile(path.join(__dirname, '../../build', 'index.html'))
});

server.listen(port, () => console.log(`Listening on port ${port}`));

приложение. js

const [socket] = useSocket("localhost:4001");

    useEffect( () => {
        socket.emit("test", "test message");
        socket.on("test response", data => {
            console.log("test response received");
            setTestData(data);
        })
    });

    function handleEmission() {
        console.log("emmitting");
        socket.emit("test", "test message");
    }
    ...
    <button onClick={() => handleEmission()}>Handle emission</button>

Весь код размещен на https://github.com/faire2/loreHunters .

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...