Socket.io服务器给我ERR_CONNECTION_REFUSED

时间:2018-03-13 01:39:56

标签: reactjs express socket.io

嘿伙计我在运行服务器时遇到连接拒绝错误。我正在尝试使用react构建一个简单的聊天应用程序。

在后端我有

var express = require('express');
var socket = require('socket.io');

var app = express();


server = app.listen(5000, function(){
    console.log('server is running on port 5000')
});

io = socket(server);

io.on('connection', (socket) => {
    console.log(socket.id);

    socket.on('SEND_MESSAGE', function(data){
        io.emit('RECEIVE_MESSAGE', data);
    })
});

在前端app.js上我有:

import React from "react";
import io from "socket.io-client";

class Chat extends React.Component{
    constructor(props){
        super(props);

        this.state = {
            username: '',
            message: '',
            messages: []
        };

        this.socket = io('localhost:5000');

        this.socket.on('RECEIVE_MESSAGE', function(data){
            addMessage(data);
        });

        const addMessage = data => {
            console.log(data);
            this.setState({messages: [...this.state.messages, data]});
            console.log(this.state.messages);
        };

        this.sendMessage = ev => {
            ev.preventDefault();
            this.socket.emit('SEND_MESSAGE', {
                author: this.state.username,
                message: this.state.message
            })
            this.setState({message: ''});

        }
    }

我确保我的文件结构设置正确。我在端口5000上监听,但我也尝试在端口3000上监听,因为那是我的npm开始带我去运行我的聊天应用程序。同样的错误。如果我将其更改为端口3000,我有时会得到404未找到的错误,如果这有用的话。我没有很多反应OR socket.io的经验,但这一直在伤害我的头脑。任何帮助将不胜感激!

1 个答案:

答案 0 :(得分:0)

如果您发布的代码是您的所有代码,并且如果您在提及时使用npm start启动服务器,则会发生以下情况:

  • 默认情况下(查看您的package.json文件),npm start启动default server,只为src中的文件提供服务。开发前端非常有用,但不运行服务器代码。所以正在运行的服务器不会监听websocket。所以你得到ERR_CONNECTION_REFUSED
  • 如果您将npm start配置为运行服务器代码,则会收听websocket,但不会提供HTML文件。因为你忘记了代码中的那一部分。所以你会得到404。

我建议您构建捆绑包并提供服务。为此,请在server.js之前的app.listen()中添加此行:

app.use(express.static('./build'));

你像这样运行你的服务器:

npm run build
node server.js

您也可以选择在开发模式下运行应用程序,但我需要搜索命令并将其提供给您。