Socket.io 一些 emmits 不会触发,而另一些会触发
Socket.io some emmits doesn't trigger while others do
我一直在努力熟悉 socket.io 所以在实时应用程序中使用它。我经历了一个基本的例子,一个聊天室,然后我使用 ngrok 对多个客户端进行了测试,一切都很好。现在我正在寻找使用 TAFFY 来保存对话日志并将其部署到连接到它的新用户所以我添加了另一个 emmit 来发送该日志,并且这个特定的 emmit 似乎从未触发 在客户端句
这些是服务器说明
io.on('connection', function(socket){
console.log("someone connected");
var chatLog={log:[]};
log().each(function (iter){ //this is the taffy var
chatLog.log.push({"usr":iter.usr,"msg":iter.msg});
});
var stringLog=JSON.stringify(chatLog);
console.log(stringLog);
socket.emit('cargaLog', stringLog);// THIS is the naughty emmit
socket.on('chat message', function(msg){
var mensaje=JSON.parse(msg);
log.insert({"usr":mensaje.usr,
"msg":mensaje.msg
});
io.emit('chat message', mensaje.usr.toUpperCase()+" dice: "+mensaje.msg);
});
});
客户端
$(function () {
var socket = io();
socket.on('cargaLog', function(log){
alert(log); //this never happens
console.log(log);
});
$('form').submit(function(){
var mensaje=$('#m').val();
var json='{"usr":"'+person+'","msg":"'+mensaje+'"}';
socket.emit('chat message', json);
$('#m').val('');
return false;
});
socket.on('chat message', function(msg){
var html='<li><img src="defaultUsrImg.png" alt="Usr_img" heigth="40" width="40">'+(msg)+'</li>';
$('#messages').append(html);
window.scrollTo(0, document.body.scrollHeight);
});
});
我盯着这段代码看了一段时间,none 与其他人合作的解决方案对我有用(即使用 io.connect() 或 io.connect( 'http://0.0.0.0:8080') 在客户端或有来自客户端的 emmit 请求触发服务器 emmit。
有人知道为什么会这样吗?
或者,有人知道可以帮助我更好地解决此问题吗?
其他详细信息是:
运行 windows 10
节点版本 8.2.1
socket.io 版本 2.0.3
我使用节点的方式要求:
var TAFFY = require('taffy');
var express=require('express');
var app = express();
var http = require('http');
var path=require('path');
var port = process.env.PORT || 3000;
var server= http.createServer(app).listen(port);
var io = require('socket.io').listen(server);
var log=TAFFY({"usr":"SERVER",
"msg":"WELCOME"
});
app.use(express.static(__dirname + '/public'));
app.get('/', function(req, res){
res.sendFile(__dirname + '/index.html');
});
客户端 html 代码(只有 boddy 因为 mt html 包含并且它会太长
<body>
<ul id="messages"></ul>
<form action="">
<input id="m" autocomplete="off" /><button>Send</button>
</form>
<script type="text/javascript" src="./socket.io/socket.io.js"></script>
<script src="jquery-3.2.1.min.js"></script>
<!-- <script src="/mensajes.js"></script> THIS IS THE OLD CODE-->
<script >
var person = prompt("Introduce tu nombre o seudonimo", "anon"); //THIS IS THE WORKING CODE
if(person === null || person===""){
alert("Necesitas un nombre para participar");
}
else{
$(function () {
var socket = io();
socket.emit('ia iege',person);
socket.on('usrConectado',function(usr){
var html='<li><h6>'+(usr)+' se ha conectado</h6></li>';
$('#messages').append(html);
window.scrollTo(0, document.body.scrollHeight);
});
$('form').submit(function(){
var mensaje=$('#m').val();
var json='{"usr":"'+person+'","msg":"'+mensaje+'"}';
socket.emit('chat message', json);
$('#m').val('');
return false;
});
socket.on('chat message', function(msg){
var html='<li><img src="https://dujrsrsgsd3nh.cloudfront.net/img/emoticons/419693/pedreiro-1500067445.PNG" alt="Usr_img" heigth="40" width="40">'+(msg)+'</li>';
$('#messages').append(html);
window.scrollTo(0, document.body.scrollHeight);
});
socket.on('cargaLog', function(log){
console.log(log);
var oldLog=JSON.parse(log);
cargaLog(oldLog);
});
});
function cargaLog(newLog){
//newLog is an object
newLog.log.forEach(function(iter){
var msg=iter.usr.toUpperCase()+' dijo: '+iter.msg;
var html='<li><img src="https://dujrsrsgsd3nh.cloudfront.net/img/emoticons/419693/pedreiro-1500067445.PNG" alt="Usr_img" heigth="40" width="40">'+(msg)+'</li>';
$('#messages').append(html);
window.scrollTo(0, document.body.scrollHeight);
});
}
}
</script>
</body>
尝试
socket.emit('chat message' , { usr: person, msg: mensaje});
我认为您可以尝试查看此存储库 https://github.com/egin10/socket-chat-example/blob/master/app.js 以供 server
参考。
你可以在 client
那边试试这个 https://github.com/egin10/socket-chat-example/blob/master/chat.html
注意:只记得socket.on(params, callback)
,它是用来从emmiter取数据的,io.emit(params, obj)
在server
这边是用来发射数据的。
所以,您必须确定您发送到 server
或 client
的内容以及您从 server
或 [=11= 获取的内容 (socket.on()
) ] 必须具有相同的 params
.
并且您必须确保您的对象是 var chatLog={log:[]};
。如果你想得到 log
,你必须这样做 chatLog.log
.
这对我有用。希望对你有帮助。
我将您的代码缩减为最基本的代码,并且我收到的消息很好,您遇到了问题。这是工作正常的精简代码:
服务器代码:
var express = require('express');
var app = express();
var http = require('http');
var path = require('path');
var port = process.env.PORT || 3000;
var server= http.createServer(app).listen(port);
var io = require('socket.io').listen(server);
app.get('/', function(req, res){
res.sendFile(__dirname + '/s1.html');
});
io.on('connection', function(socket) {
console.log("someone connected");
var chatLog = {log: [{usr: "someuser", msg: "somemsg"}]};
var stringLog = JSON.stringify(chatLog);
console.log(stringLog);
socket.emit('cargaLog', stringLog); // THIS is the naughty emmit
});
客户代码:
<html>
<head>
<script src="/socket.io/socket.io.js"></script>
<script src="http://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script>
<script>
function dbg(x) {
let str = x;
if (typeof x === "object") {
str = JSON.stringify(x);
}
$("#log").append("<div>" + str + "</div>");
}
$(function() {
var socket = io();
socket.on('cargaLog', function(log) {
dbg(log);
});
});
</script>
</head>
<body>
Empty Content, waiting for message to arrive.
<div id="log"></div>
</body>
</html>
当我加载页面时,浏览器立即显示您遇到问题的 cargaLog 消息。我建议你回溯到像这样超级简单的东西,直到你证明它有效,然后一次一个地添加东西,直到你找到问题的根源。如果此代码对您不起作用,那么您的环境中一定有问题,我可能会重新安装各种组件(socket.io、node.js、express 等...) .
我一直在努力熟悉 socket.io 所以在实时应用程序中使用它。我经历了一个基本的例子,一个聊天室,然后我使用 ngrok 对多个客户端进行了测试,一切都很好。现在我正在寻找使用 TAFFY 来保存对话日志并将其部署到连接到它的新用户所以我添加了另一个 emmit 来发送该日志,并且这个特定的 emmit 似乎从未触发 在客户端句
这些是服务器说明
io.on('connection', function(socket){
console.log("someone connected");
var chatLog={log:[]};
log().each(function (iter){ //this is the taffy var
chatLog.log.push({"usr":iter.usr,"msg":iter.msg});
});
var stringLog=JSON.stringify(chatLog);
console.log(stringLog);
socket.emit('cargaLog', stringLog);// THIS is the naughty emmit
socket.on('chat message', function(msg){
var mensaje=JSON.parse(msg);
log.insert({"usr":mensaje.usr,
"msg":mensaje.msg
});
io.emit('chat message', mensaje.usr.toUpperCase()+" dice: "+mensaje.msg);
});
});
客户端
$(function () {
var socket = io();
socket.on('cargaLog', function(log){
alert(log); //this never happens
console.log(log);
});
$('form').submit(function(){
var mensaje=$('#m').val();
var json='{"usr":"'+person+'","msg":"'+mensaje+'"}';
socket.emit('chat message', json);
$('#m').val('');
return false;
});
socket.on('chat message', function(msg){
var html='<li><img src="defaultUsrImg.png" alt="Usr_img" heigth="40" width="40">'+(msg)+'</li>';
$('#messages').append(html);
window.scrollTo(0, document.body.scrollHeight);
});
});
我盯着这段代码看了一段时间,none 与其他人合作的解决方案对我有用(即使用 io.connect() 或 io.connect( 'http://0.0.0.0:8080') 在客户端或有来自客户端的 emmit 请求触发服务器 emmit。
有人知道为什么会这样吗? 或者,有人知道可以帮助我更好地解决此问题吗?
其他详细信息是: 运行 windows 10 节点版本 8.2.1 socket.io 版本 2.0.3
我使用节点的方式要求:
var TAFFY = require('taffy');
var express=require('express');
var app = express();
var http = require('http');
var path=require('path');
var port = process.env.PORT || 3000;
var server= http.createServer(app).listen(port);
var io = require('socket.io').listen(server);
var log=TAFFY({"usr":"SERVER",
"msg":"WELCOME"
});
app.use(express.static(__dirname + '/public'));
app.get('/', function(req, res){
res.sendFile(__dirname + '/index.html');
});
客户端 html 代码(只有 boddy 因为 mt html 包含并且它会太长
<body>
<ul id="messages"></ul>
<form action="">
<input id="m" autocomplete="off" /><button>Send</button>
</form>
<script type="text/javascript" src="./socket.io/socket.io.js"></script>
<script src="jquery-3.2.1.min.js"></script>
<!-- <script src="/mensajes.js"></script> THIS IS THE OLD CODE-->
<script >
var person = prompt("Introduce tu nombre o seudonimo", "anon"); //THIS IS THE WORKING CODE
if(person === null || person===""){
alert("Necesitas un nombre para participar");
}
else{
$(function () {
var socket = io();
socket.emit('ia iege',person);
socket.on('usrConectado',function(usr){
var html='<li><h6>'+(usr)+' se ha conectado</h6></li>';
$('#messages').append(html);
window.scrollTo(0, document.body.scrollHeight);
});
$('form').submit(function(){
var mensaje=$('#m').val();
var json='{"usr":"'+person+'","msg":"'+mensaje+'"}';
socket.emit('chat message', json);
$('#m').val('');
return false;
});
socket.on('chat message', function(msg){
var html='<li><img src="https://dujrsrsgsd3nh.cloudfront.net/img/emoticons/419693/pedreiro-1500067445.PNG" alt="Usr_img" heigth="40" width="40">'+(msg)+'</li>';
$('#messages').append(html);
window.scrollTo(0, document.body.scrollHeight);
});
socket.on('cargaLog', function(log){
console.log(log);
var oldLog=JSON.parse(log);
cargaLog(oldLog);
});
});
function cargaLog(newLog){
//newLog is an object
newLog.log.forEach(function(iter){
var msg=iter.usr.toUpperCase()+' dijo: '+iter.msg;
var html='<li><img src="https://dujrsrsgsd3nh.cloudfront.net/img/emoticons/419693/pedreiro-1500067445.PNG" alt="Usr_img" heigth="40" width="40">'+(msg)+'</li>';
$('#messages').append(html);
window.scrollTo(0, document.body.scrollHeight);
});
}
}
</script>
</body>
尝试
socket.emit('chat message' , { usr: person, msg: mensaje});
我认为您可以尝试查看此存储库 https://github.com/egin10/socket-chat-example/blob/master/app.js 以供 server
参考。
你可以在 client
那边试试这个 https://github.com/egin10/socket-chat-example/blob/master/chat.html
注意:只记得socket.on(params, callback)
,它是用来从emmiter取数据的,io.emit(params, obj)
在server
这边是用来发射数据的。
所以,您必须确定您发送到 server
或 client
的内容以及您从 server
或 [=11= 获取的内容 (socket.on()
) ] 必须具有相同的 params
.
并且您必须确保您的对象是 var chatLog={log:[]};
。如果你想得到 log
,你必须这样做 chatLog.log
.
这对我有用。希望对你有帮助。
我将您的代码缩减为最基本的代码,并且我收到的消息很好,您遇到了问题。这是工作正常的精简代码:
服务器代码:
var express = require('express');
var app = express();
var http = require('http');
var path = require('path');
var port = process.env.PORT || 3000;
var server= http.createServer(app).listen(port);
var io = require('socket.io').listen(server);
app.get('/', function(req, res){
res.sendFile(__dirname + '/s1.html');
});
io.on('connection', function(socket) {
console.log("someone connected");
var chatLog = {log: [{usr: "someuser", msg: "somemsg"}]};
var stringLog = JSON.stringify(chatLog);
console.log(stringLog);
socket.emit('cargaLog', stringLog); // THIS is the naughty emmit
});
客户代码:
<html>
<head>
<script src="/socket.io/socket.io.js"></script>
<script src="http://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script>
<script>
function dbg(x) {
let str = x;
if (typeof x === "object") {
str = JSON.stringify(x);
}
$("#log").append("<div>" + str + "</div>");
}
$(function() {
var socket = io();
socket.on('cargaLog', function(log) {
dbg(log);
});
});
</script>
</head>
<body>
Empty Content, waiting for message to arrive.
<div id="log"></div>
</body>
</html>
当我加载页面时,浏览器立即显示您遇到问题的 cargaLog 消息。我建议你回溯到像这样超级简单的东西,直到你证明它有效,然后一次一个地添加东西,直到你找到问题的根源。如果此代码对您不起作用,那么您的环境中一定有问题,我可能会重新安装各种组件(socket.io、node.js、express 等...) .