尝试将客户端连接到服务器时出现Node.js Socket.io错误

Posted

技术标签:

【中文标题】尝试将客户端连接到服务器时出现Node.js Socket.io错误【英文标题】:Node.js Socket.io Error when trying to connect client to server 【发布时间】:2022-01-20 18:10:25 【问题描述】:

我正在尝试创建一个网络聊天,为此我们首先需要通过 Node 和 Socket.io 建立一个客户端到服务器的连接 - 但它不起作用。

服务器代码在这里: https://collectiveboost.com/cb_node/chat_app/server.js

并且通过以下方式启动时运行良好:node server.js 将结果打印到 putty 命令行:“Socket io Server Chat Started...”

但是在客户端,socket.io 连接没有发生:( 我们已经尝试了两种方式,即通过全局 socket.io,如您在此处看到的: https://collectiveboost.com/cb_node/chat_app/index.htm

这会导致错误: 加载资源失败:服务器响应状态为 404(未找到) 未捕获的引用错误:io 未在 (index):14 处定义

通过客户端 JS 文件的本地版本,可以通过以下方式访问:node_modules/socket.io/client-dist/socket.io.js 如上所述: https://socket.io/get-started/chat

你可以在这里看到: https://collectiveboost.com/cb_node/chat_app/index_2.htm

这会导致错误: polling-xhr.js:157 GET https://collectiveboost.com/socket.io/?EIO=4&transport=polling&t=Nt9UN_R 404(未找到)

那么我们做错了什么? 我们如何将客户端网页socket.io连接到服务器?

谢谢

【问题讨论】:

【参考方案1】:

请尝试此代码,它对您非常有用。 它是一个基本的简单聊天系统。

服务器代码

var app = require('express')();
    var http = require('http').Server(app);
    var io = require('socket.io')(http);
    
    app.get('/', function(req, res) 
        res.sendFile(__dirname + '/index6.html');
    );
    var username = '';
    var rooms;
    io.on('connection', function(socket) 
        console.log("User connected");
        socket.on('join', function(name) 
            username = name;
            //console.log(username)
            io.emit('chat-msg', `$username.toUpperCase() Welcome`);
        )
        socket.join(rooms)
        socket.on('chat msg', function(msg) 
            //console.log(msg);
            io.sockets.in(rooms).emit('chat msg', msg)
                //console.log(array)
        )
    
        socket.on('disconnect', function(name) 
            console.log("disconnet")
            io.emit('chat-msg', `$username.toUpperCase() disconnected`)
        )
    
    );
    
    http.listen(5600, function() 
        console.log('listening on localhost:5600');
    );

客户端代码

<!DOCTYPE html>
<html>

<body>
    <div class="box">
        <ul id="messages">

        </ul>
        <ul id="messages1">
        </ul>

        <form action="">
            <input id="inp" placeholder="Enter your message..." autocomplete="off" required /><button>Send</button>
        </form>
        <script src="/socket.io/socket.io.js"></script>
        <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
        <script>
            var name = prompt("enter name")
            var socket = io();
            socket.emit('join', name);


            $('form').submit(function(event) 
                event.preventDefault();
                socket.emit("chat msg", (name + " : " + $("#inp").val()));
                //$('#messages').append($('<li id="list">').text('You: ' +$('#inp').val()));
                $('#inp').val('');
            );

            socket.on('chat-msg', function(msg) 
                $('#messages').append($('<li id="list"><br>').text(msg));

            )
            socket.on('chat msg', function(msg) 
                $('#messages1').append($('<li id="list1"><br>').text(msg));

            )
            socket.on('left', function(data) 
                document.write(data.description)
            )
        </script>
    </div>
    <style>
        .box 
            border: 1px solid red;
            height: auto;
            width: 500px;
            position: absolute;
            right: 300px;
            border-radius: 10px;
            padding: 30px;
        
        
        #inp 
            position: absolute;
            bottom: 10px;
            right: 200px;
            outline: none;
            border: soild blue;
            border-radius: 5px;
        
        
        ul 
            list-style-type: none;
            padding: 50px;
            text-align: center;
        
        
        #list 
            text-align: center;
            background-color: #6195e8;
            color: #fffafa;
            border-radius: 10px;
        
        
        #list1 
            text-align: right;
            background-color: #6bdde3;
            color: #ed001c;
        
        
        button 
            color: White;
            background-color: green;
            width: 80px;
            border-radius: 10px;
            position: absolute;
            right: 150px;
            bottom: 10px;
        
        
        #messages li 
            padding: 5px 10px;
        
    </style>
</body>



</html>

【讨论】:

谢谢。但我确实有聊天的代码。我的问题/问题是客户端的 Socket.io 代码没有与聊天的基于节点的服务器部分建立连接。也就是说,此代码不会导致浏览器到服务器连接: 导致我在问题中发布的错误。这就是我需要回答的全部内容。再次感谢大家。 试试这个

以上是关于尝试将客户端连接到服务器时出现Node.js Socket.io错误的主要内容,如果未能解决你的问题,请参考以下文章

尝试将 IDEA 连接到 Jira 时出现“handshake_failure”错误

尝试连接到 MySQL 数据库时出现“db is not defined”错误[关闭]

通过 node.js 连接到 mysql 时出现未知数据库错误

使用私钥连接到服务器时出现pysftp AuthenticationException

在 node.js 服务器上使用 nginx 时出现“websocket 连接无效”

TCP-IP 套接字 C:尝试连接到服务器套接字时出现错误地址错误