Node.js Socket.io的broadcast.emit在此处使用不正确?
作为Node和Socket.IO的新手,我正在开发的这个聊天应用程序做得很好,只是我无法让服务器向所有客户端广播消息。我已经检查了不一致的变量,可能在玩游戏时创建了一些,我道歉;P但它不起作用了?我很困惑,因为我没有收到任何控制台错误或类似的东西,这使得调试非常困难。可能是我第一次遇到回调如何以不需要的方式嵌套 无论如何,这里有一些代码: App.js: index.html:Node.js Socket.io的broadcast.emit在此处使用不正确?,node.js,events,socket.io,broadcast,Node.js,Events,Socket.io,Broadcast,作为Node和Socket.IO的新手,我正在开发的这个聊天应用程序做得很好,只是我无法让服务器向所有客户端广播消息。我已经检查了不一致的变量,可能在玩游戏时创建了一些,我道歉;P但它不起作用了?我很困惑,因为我没有收到任何控制台错误或类似的东西,这使得调试非常困难。可能是我第一次遇到回调如何以不需要的方式嵌套 无论如何,这里有一些代码: App.js: index.html: 好的,让我们把这个问题分解成许多小的子问题 当你说你不能记录或警告数据时,你是在哪一点上尝试的?你的评论有什么问题吗
好的,让我们把这个问题分解成许多小的子问题 当你说你不能记录或警告数据时,你是在哪一点上尝试的?你的评论有什么问题吗 如果这是在server.on'connect',functiondata{…您将永远无法获得任何数据。connect事件纯粹是信息性的 这两种方法都不会将数据发送回连接\chat的客户端 因此,如果希望将它们打印在同一个客户端窗口中,则必须在它们的正下方添加client.emit,以便将消息发送到导致这些操作的客户端窗口 编辑:这是来自文档:广播意味着向所有人发送消息,启动它的套接字除外 服务器广播聊天事件,但客户端仅侦听消息事件。已修复 如果您有任何其他问题,请告诉我 我不会将您创建的套接字分别称为客户端上的“服务器”和服务器上的“客户端”。这会让人有点困惑;
好的,让我们把这个问题分解成许多小的子问题 当你说你不能记录或提醒数据时,你在哪一点上尝试这个问题?从你的评论来看 如果这是在server.on'connect',functiondata{…您将永远无法获得任何数据。connect事件纯粹是信息性的 这两种方法都不会将数据发送回连接\chat的客户端 因此,如果希望将它们打印在同一个客户端窗口中,则必须在它们的正下方添加client.emit,以便将消息发送到导致这些操作的客户端窗口 编辑:这是来自文档:广播意味着向所有人发送消息,启动它的套接字除外 服务器广播聊天事件,但客户端仅侦听消息事件。已修复 如果您有任何其他问题,请告诉我 我不会将您创建的套接字分别称为客户端上的“服务器”和服务器上的“客户端”。这会让人有点困惑;
你的代码对我来说似乎很好,现在我又看了一遍,我能看看你处理连接的客户端代码吗?所有客户端代码都在靠近底部的index.html中的标记中啊,对不起,不习惯它在一个文件中。当它足够小的时候,我通常都保存在一个文件中-为了五种习惯,你能给io.sockets.emit一个快速尝试吗?你的代码对我来说似乎很好,现在我又看了一遍,我能看看你处理连接的客户端代码吗所有客户端代码都在靠近底部的index.html标记中啊,对不起,不习惯它在一个文件中。当它足够小的时候,我通常把它放在一个文件中。为了五种习惯,你能给io.sockets.emit一个快速尝试吗n在客户端侦听和接收它们的回调。不在服务器上。在“连接”上……我只要求在那里的连接事件上输入用户名,然后将数据提交到服务器。2.如果使用client.broadcast.emit将消息发送到每个客户端,第二次发送信息的目的是什么?3.它们都是在发布问题之前,我认为这就是问题所在,因此我说我可能创建了一些不一致的变量。它仍然不起作用…:奇怪的是,我将所有服务器/客户端变量都更改为套接字,现在当我在ch中键入消息时,控制台会记录调试广播数据包在box。我会说这是一个进步,但它仍然不会显示消息。好的,现在你只需要重新阅读问题2的解释,事情可能会开始起作用。我做了,一开始它不起作用,但那是因为我在尝试不同的解决方案时忘记删除不同的数据类型。我下面的指南没有提到必须删除socket.broadcast.emit以及socket.emit,你能解释为什么这是必要的吗?我以为socket.broadcast.emit可以自己工作…?你可以在这里阅读官方文档:这里有一个关于广播消息的标题:1.在客户端侦听和接收消息的回调中。不在服务器中。在“连接”上…我只是要求连接事件上的用户名,该数据将提交到服务器。2.如果使用client.broadcast.emit将消息发送到每个客户端,第二次发送信息的目的是什么?3.它们都广播/侦听消息
事件,我认为这是发布问题之前的问题,因此我说我可能创建了一些不一致的变量。它仍然不起作用…:奇怪的是,我将所有服务器/客户端变量都更改为socket,现在当我在聊天框中键入消息时,控制台会记录调试广播数据包。我会说这是一个进步,但它仍然不会显示消息。好的,现在你只需要重新阅读问题2的解释,事情可能会开始起作用。我做了,一开始它不起作用,但那是因为在尝试不同的解决方案时,我忘了删除不同的数据类型。我遵循的指南没有提到必须使用socket.broadcast.emit以及socket.emit,您能解释一下为什么这是必要的吗?我以为socket.broadcast.emit可以自己工作…?你可以在这里阅读官方文件:这里有一个关于广播消息的标题:
// Require dependencies
var express = require('express');
var app = express();
var http = require('http');
var server = http.createServer(app);
var io = require('socket.io').listen(server);
// Listen for connections
io.sockets.on('connection', function(client) {
console.log("Someone is connecting...");
client.on('join', function(name) {
client.set('nickname', name);
console.log(name+" has connected!");
client.broadcast.emit('connected', name + " has connected");
});
// Receive messages from the client and broadcast them to everyone
client.on('messages', function(data) {
client.get('nickname', function(err, name) {
client.broadcast.emit("chat", name + ": " + data);
});
});
});
// Without this line, the CSS will not work
app.use('/public', express.static(__dirname + '/public'));
// Route index.html to the root path
app.get('/', function(request, response) {
response.sendfile(__dirname + "/index.html");
});
// Listen for GET requests to the server
server.listen(3000);
console.log("Listening on port 3000");
<!DOCTYPE html>
<html>
<head>
<title>Chatapp</title>
<link rel="stylesheet" type="text/css" href="public/default.css"></link>
</head>
<body>
<h1 class="title">Chatapp</h1>
<div id="wrapper">
<div id="online">
</div>
<div id="body">
<div id="status"></div>
<div id="chat">
</div>
</div>
<div id="input">
<form id="chatform">
<input type="text" id="message"></input>
<input type="submit" id="send" value="Send!"></input>
</form>
</div>
<div class="clear"></div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="/socket.io/socket.io.js"></script>
<script>
// Wait until DOM is ready
$(document).ready(function() {
// Establish a connection to the server
var server = io.connect('http://localhost:3000');
// On submit, send the chat form message to the server, prevent default redirect and reset the chat form
$('#chatform').submit(function(e) {
e.preventDefault();
var message = $('#message').val();
server.emit('messages', message);
$('#chatform')[0].reset();
});
server.on('connect', function(data) {
nickname = prompt('What is your nickname?');
$('#status').html('Connected to Chatapp as ' +nickname);
server.emit('join', nickname);
});
server.on('connected', function(data) {
$('<p>'+data+'</p>').appendTo('#chat');
});
// Listen for messages broadcasted to every client by the server - this does not work for some reason.
server.on('chat', function(data) {
$(data).appendTo('#chat');
});
});
</script>
</body>
</html>
body {
margin: 0;
padding: 0;
font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
}
a {
color: #00B7FF;
}
#wrapper {
margin: 0 auto;
width: 940px;
height: 500px;
padding: 0;
border: 1px solid #000;
}
#online {
float: left;
width: 188px;
height: 480px;
padding: 10px;
border-right: 1px solid #000;
background: #3d3d3d;
color: #eee;
box-shadow: inset 1px 1px 0px #fff, inset -1px -1px 0px #fff;
}
#body {
float: left;
width: 731px;
height: 439px;
padding: 0;
border-bottom: 1px solid #000;
}
#status {
color: #eee;
height: 30px;
border-bottom: 1px solid #000;
background: #3d3d3d;
padding-left: 10px;
line-height: 30px;
box-shadow: inset 1px 1px 0px #fff, inset -1px -1px 0px #fff;
}
#chat {
background: #c4f2eb;
height: 388px;
padding: 10px;
box-shadow: inset 1px 1px 0px #fff, inset -1px -1px 0px #fff;
}
#input {
float: left;
height: 60px;
width: 731px;
}
.clear {
clear: both;
}
h1.title {
text-align: center;
}
input#message {
float: left;
margin: 0;
width: 640px;
height: 58px;
border: none;
font-size: 28px;
padding-left: 10px;
box-shadow: inset 1px 1px 3px rgba(0,0,0,0.3);
}
input#message:focus {
border: none;
outline: none;
box-shadow: inset 1px 1px 3px #55ba57, inset -1px -1px 3px #55ba57;
}
input#send {
float: left;
background: #55ba57;
color: #fff;
border: none;
height: 60px;
margin: 0;
width: 81px;
border-left: 1px solid #000;
box-shadow: inset 1px 1px 0px #fff, inset -1px -1px 0px #fff;
}
input#send:hover {
background: #489949;
cursor: pointer;
}
input#send:active {
background: #1e7520;
}
client.broadcast.emit('connected', name + " has connected");
client.broadcast.emit("chat", name + ": " + data);