Node.js Socket.io无法在ReactJS应用程序中连接

我正在使用react、节点和express和socket.io构建一个小应用程序。我正在使用socket.io创建聊天功能，但它似乎无法连接。在服务器的控制台中没有错误消息，但在浏览器中，我反复收到一个错误消息

POST http://localhost:3000/socket.io/?EIO=3&transport=polling&t=Lb-j6De 404 (Not Found).

我不知道出了什么问题，我查阅了文件，但我仍在努力解决这个问题

我的服务器

import express from 'express';
import mongoose from 'mongoose';
import bodyParser from 'body-parser';
import passport from 'passport';
import cros from 'cors';
import path from 'path';
import webpack from 'webpack';
import http from 'http';
import SocketIO from 'socket.io';
import webpackmiddleware from 'webpack-dev-middleware';
import webpackHotMiddleware from 'webpack-hot-middleware';
import webpackConfig from '../webpack.config.dev';
import regusers from './models/regusers.model';
import Router from './routes/UserRouter';
import Chat from './services/socket/chat';

const cross = cros();
const app = express();
const router = express.Router();
const server = http.Server(app);
const io = new SocketIO(server);
const port =3000;
const compile=webpack(webpackConfig);
const db='mongodb://localhost/parkspace';

let users = [];
let sockets = {};

mongoose.Promise = global.Promise;

mongoose.connect(db);

app.use(webpackmiddleware(compile,{
  hot:true,
  publicPath: webpackConfig.output.publicPath,
  noInfo:true
}));

app.use(webpackHotMiddleware(compile));
app.use(cross);
app.use(router);

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
   extended:true
}));


app.listen(port,()=> console.log('Running on port: '+port));

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

Router(app);
// Chat(app,io);

io.on('connection', (socket) => {

        console.log('connected');

        socket.on('message', (msg) => {
            console.log(msg);
        });

        socket.on('disconnect', () => {
            console.log('disconnected');
        });

});



app.get('*',(req,res) => {
   res.sendFile(path.resolve(__dirname,'./index.html'));
});

我的前端

import React from 'react';
import io from 'socket.io-client';
import Paper from 'material-ui/Paper';
import TextField from 'material-ui/TextField';
import FlatButton from 'material-ui/FlatButton';


const socket = io.connect('http://localhost:3000');

const style = {
  margin: 20,
  textAlign: 'center',
  display: 'inline-block',
};

const styleInput = {
    padding:10,
    margin: 10,
    width: '85%'

};

const styleButton = {
    margin:12,
    float:'right'
};


class chatContainer extends React.Component{

    constructor(props){
       super(props);
       this.state={

       };
    }

    chatmessage = () => {
        let message = this.refs.chattext.getValue();
        socket.emit('message', message);
        console.log('emmited');

    }


   render(){
     return(
         <div socket = { socket } >
            <Paper style={style} zDepth={2} className="row">
                <TextField
                  hintText="Type message here..."
                  multiLine={true}
                  rows={2}
                  rowsMax={4}
                  style={styleInput}
                  className="col-md-12"
                  fullWidth={true}
                  ref="chattext"
                />
                <div className="col-md-3" style={styleButton} className="row" >
                   <FlatButton label="Send" onTouchTap={this.chatmessage}/>
                   <FlatButton label="Cancel"/>
                </div>
            </Paper>
         </div>
     );
   }
}

export default chatContainer;

从“React”导入React；
从“socket.io客户端”导入io；
从“物料界面/纸张”导入纸张；
从“物料界面/文本字段”导入文本字段；
从“物料界面/平面按钮”导入平面按钮；
常量套接字=io.connect（'http://localhost:3000');
常量样式={
差额：20，
textAlign:'中心'，
显示：“内联块”，
};
常量styleInput={
填充：10，
差额：10，
宽度：“85%”
};
常量样式按钮={
差额：12，
浮动：'对'
};
类chatContainer扩展了React.Component{
建造师（道具）{
超级（道具）；
这个州={
};
}
聊天信息=（）=>{
让message=this.refs.chattext.getValue（）；
发出（'message'，message）；
console.log（'emmited'）；
}
render（）{
返回(
);
}
}
导出默认容器；

---

任何原因都可以解释为什么它没有连接，为什么我没有从服务器的控制台中获取任何与socketio相关的日志。

@Azium是正确的。问题是您要求express而不是http进行侦听。这对我很有用：

let express = require('express'),
    app = express(),
    server = require('http').Server(app),
    io = require('socket.io')(server);

server.listen(port);

---

您的

io

对象是从

server

创建的，但您正在收听

app

。你应该改为

服务器。听

。另外，为什么您的

cors

变量名为

cross

？