我找不到一种方法让套接字与react和nodejs一起工作

Question

我已经尝试了所有方法，但总是得到:getxhr.js:203获取轮询404 (未找到) http://localhost:3000/socket.io/?EIO=4&transport=polling&t=NPGI2WE -xhr.js

我的服务器：

const express = require("express");
const http = require("http");
const app = express();
const server = http.createServer(app)
const cors = require('cors');
app.use(cors());
app.options('*', cors());
const socketio = require('socket.io')
const io = socketio(server);

io.on("connection", socket => {

    socket.on("welcome", () => {
        console.log("hello");
    })
});


const port = 3000;

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

在组件react中

import React from 'react'

import io from "socket.io-client";
let socket = io("http://localhost:3000");


export default function Socket() {
    socket.emit("welcome", "hello client");
    return (
        <div>
            <h2>Hello</h2>
        </div>
    )
}

react在"localhost:3001“中运行，nodejs在"localhost:3000”中运行

我再也不知道怎么做了，甚至连一个简单的"hello“都不知道。

Answer 1

下面的方法对我很有效，

服务器代码：

   const express = require("express");
    const http = require("http");
    const app = express();
    const server = http.createServer(app)
    const cors = require('cors');
    app.use(cors());
    app.options('*', cors());
    const socketio = require('socket.io')
    const io = socketio(server);
    
    io.on("connection", socket => {
    
        console.log("Hello connected");
        
        socket.on("welcome", () => {
            console.log("hello");
        })
    });
    
    
    const port = 3000;
    
    server.listen(port, () => console.log(`listen on port ${port}`)) 

客户端代码：

const io =  require("socket.io-client");
let socket = io.connect("http://localhost:3000");

socket.emit("welcome", "connected");