时间戳

首页 > 解决方案 > Socket.io-client 会循环并且从不响应事件

reactjs - Socket.io-client 会循环并且从不响应事件

问题描述

我有一个 socket.io 聊天应用程序，我正在尝试为其制作一个反应前端。但是，socket.io-client将无休止地连接到我的服务器，而无需进行任何调用，例如socket.emit()使用socket.on(). 这是我的后端：

var app = require('express')();
var http = require('http');
var server = http.createServer(app);
var io = require('socket.io')(server);
app.use(require('cors')());

io.on('connection', (socket) => {
    console.log('new user connected');
    io.to(socket.id).emit('msg', 'hello there');

    socket.on('joining msg', ({id, username}) => {
        console.log(username);
        socket.broadcast.emit('chat message', `Everybody welcome ${username}\n`);
    })
});

server.listen(4001, () => {
    console.log('Server listening on :4001');
});

而我的前端是：

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

export default class App extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            data: ''
        }
    }

    componentDidMount() {
        const socket = io("http://localhost:4001");
        socket.emit('joining msg', {id: 'test', username: 'test'})
        socket.on('msg', (msg) => {
            this.setState('data', msg);
        });
    }

    render() {
        return (
            <p>{this.state.data}</p>
        );
    }
}

服务器控制台将无休止地记录new user connected但从未真正记录它发出的客户端的用户名。如何防止循环并让我的应用程序正常工作？

标签： reactjssocket.io

解决方案

我所要做的就是socket.io在我的服务器上更新版本，就是这样！

推荐阅读