[英]Duplicates when I use socket.io in express.js route files
I have a problem with Node.JS/Socket.IO/Express.JS and i didn't find any solution. 我的Node.JS / Socket.IO / Express.JS有问题,我没有找到任何解决方案。
I use: 我用:
"express": "~4.10.6"
"socket.io": "1.2.1"
on Ubuntu Linux 在Ubuntu Linux上
My problem is that when I run the server and access localhost:3000/chat at the first run all works great but after a refresh/2/3/4 the messages inserted in chat duplicates. 我的问题是,当我运行服务器并在首次运行时访问localhost:3000 / chat时,所有工作都很好,但是在刷新/ 2/3/4之后,插入聊天记录中的消息重复了。 For one refresh, i have to identical message on one submit. 对于一次刷新,我必须一次提交相同的消息。 For two refreshes, I have 3 identical message and so on. 对于两次刷新,我有3条相同的消息,依此类推。 This behaviour began when i put the socket functionality in express.js routes folder. 当我将套接字功能放在express.js的路由文件夹中时,此行为开始。
PS I'm new to node.js/socket.io/express.js PS我是node.js / socket.io / express.js的新手
app.js app.js
var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var routes = require('./routes/index');
var users = require('./routes/users');
var chat = require('./routes/chat');
var app = express();
// Socket IO Things
var server = require('http').createServer(app);
var io = require('socket.io').listen(server);
// END - Socket IO Things
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
// uncomment after placing your favicon in /public
//app.use(favicon(__dirname + '/public/favicon.ico'));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use('/', routes);
app.use('/users', users);
app.use('/chat', chat.random_function(io));
// catch 404 and forward to error handler
app.use(function(req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
});
// error handlers
// development error handler
// will print stacktrace
if (app.get('env') === 'development') {
app.use(function(err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: err
});
});
}
// production error handler
// no stacktraces leaked to user
app.use(function(err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: {}
});
});
module.exports = app;
server.listen('3000');
/routes/chat.js /routes/chat.js
var express = require('express');
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res) {
res.sendFile(__dirname + '/index.html');
});
module.exports = {
router: router,
random_function: function(io) {
return function(req, res){
res.sendFile(__dirname + '/index.html');
io.sockets.on('connection', function (socket) {
socket.on('send message', function (data) {
io.sockets.emit('new message', data);
});
});
}
}
};
Client side sockets (routes/index.html) 客户端套接字 (routes / index.html)
<html>
<head>
<title>Chat with socket.io and node.js</title>
<style>
#chat {
height: 500px;
}
</style>
</head>
<body>
<div id="chat"></div>
<form id="chat-message" action="">
<input size="35" id="message"></input>
<input type="submit"></input>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="/socket.io/socket.io.js"></script>
<script>
var socket = io.connect();
var $messageForm = $('#chat-message');
var $messageBox = $('#message');
var $chat = $('#chat');
$messageForm.submit(function(e){
e.preventDefault();
socket.emit('send message', $messageBox.val());
$messageBox.val("");
});
socket.on('new message', function(data){
$chat.append(data + "<br>");
});
</script>
</body>
</html>
How can I handle this problem? 我该如何解决这个问题? Thanks in advance! 提前致谢! I also checked the debugger and on server come 1/2/3/4/5 different packages each time. 我还检查了调试器,并且每次在服务器上使用1/2/3/4/5个不同的软件包。
You're creating & attaching new connection
listener on each /chat
request. 您将在每个/chat
请求上创建并附加新的connection
侦听器。 Try moving it outside of random_function
and perhaps creating separate socket
instance for each connection/client. 尝试将其random_function
之外,并可能为每个连接/客户端创建单独的socket
实例。
(Edit) code added: (编辑)代码已添加:
Try this (should work, but I didn't test it) 试试这个(应该可以,但是我没有测试)
var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var routes = require('./routes/index');
var users = require('./routes/users');
var chat = require('./routes/chat');
var app = express();
// Socket IO Things
var server = require('http').createServer(app);
var io = require('socket.io').listen(server);
io.sockets.on('connection', function (socket) {
socket.on('send message', function (data) {
io.sockets.emit('new message', data);
});
});
// END - Socket IO Things
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
// uncomment after placing your favicon in /public
//app.use(favicon(__dirname + '/public/favicon.ico'));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use('/', routes);
app.use('/users', users);
app.use('/chat', chat.random_function);
var express = require('express');
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res) {
res.sendFile(__dirname + '/index.html');
});
module.exports = {
router: router,
random_function: function(req, res){
res.sendFile(__dirname + '/index.html');
}
};
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.