Tema: Consulta para manejo de socket.io y node.js
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 09/09/2013, 10:52
lgo80
 
Fecha de Ingreso: agosto-2013
Mensajes: 20
Antigüedad: 10 años, 8 meses
Puntos: 0
Consulta para manejo de socket.io y node.js
Hola que tal! tengo una duda! calculo que no debe ser dificil! estoy aprendiendo a usar los socket.io y el node.js e hice un ejemplo bastante simple tiene una caja de texto un botton y un div lo que hace el programa es mandar de la caja de texto lo que escribi al socket.io y de este lo pone en el div! lo que quiero hacer y no se como, es que cuando refresco la pagina el div no se borre me mantenga los datos! si alguien me puede agregar alguna funcion o procedimiento o instruccion para que no se borre, desde ya muchas gracias! pongo los archivos para que los vean! por tema de seguridad la ip y el puerto no lo pongo aunque el puerto me parece que no hacia falta pero bue cambiando eso el programa funciona!

El archivo que hace de servidor que corre en el cmd es app.js y tiene esta codificacion:

Cita:



var express = require('express');
var routes = require('./routes');
var user = require('./routes/user');
var http = require('http');
var path = require('path');

var app = express();

// all environments
app.set('port', process.env.PORT || puerto);
app.set('views', __dirname + '/views');
app.set('view engine', 'jade');
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(app.router);
app.use(express.static(path.join(__dirname, 'public')));

// development only
if ('development' == app.get('env')) {
app.use(express.errorHandler());
}

var io = require('socket.io').listen(puerto);

io.sockets.on('connection', function(socket){
socket.emit('mensaje',
{m: 'Mensaje para el cliente'});

socket.on('mensaje2',function(data){
console.log(data.m);
});

socket.on('enviarServidor', function (data){
console.log(data.m);
io.sockets.emit('enviarCliente', { m : data });
});

/*socket.on('recibir', function(){
//$('#mensajes').append(data.m.m + '<br/>');
});*/

});

app.get('/', routes.index);
app.get('/users', user.list);

http.createServer(app).listen(app.get('port'), function(){
console.log('Express server listening on port ' + app.get('port'));
});

El archivo html es hola.html y tiene esta codificacion:

Cita:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>node.js notificador</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script src="http://code.jquery.com/jquery-1.9.1.min.js" type="text/javascript"></script>
<script src='http://code.jquery.com/jquery-migrate-1.1.1.min.js' type="text/javascript"></script>
<script src="ip:puerto/socket.io/lib/socket.io.js" type="text/javascript"></script>
<script src="ip:puerto/socket.io/node_modules/socket.io-client/dist/socket.io.min.js" type="text/javascript"></script>

<script type="text/javascript">
var websocket = io.connect('ip:puerto');

websocket.on('mensaje',function(data){
console.log(data.m);
});

websocket.emit('mensaje2',
{ m: 'mensaje para el servidor'});


$(document).on('ready', function(){
$('#btnenviar').click(function(){
var str = $('#txtmensaje').val();
str.replace(/[^a-zA-Z 0-9.]+/g,' ');

websocket.emit('enviarServidor',
{ m: str });
$('#txtmensaje').val('')
});

websocket.on('enviarCliente', function(data){
$('#mensajes').append(data.m.m + '<br/>');
console.log(data.m);
});

/*websocket.emit('recibir', function(data){
$('#mensajes').append(data.m.m + '<br/>');
});
/*$('#btnEnviar').click(function(){
var str = $('#txtMensaje').val();
str.replace(/[^a-zA-Z 0-9.]+/g,' ');

websocket.emit('enviarServidor',
{ m: str });
$('#txtMensaje').val('');
*/
});

</script>
</head>
<body>
<p>Mensajes</p>
<div id='mensajes'></div>
<input type='text' name='txtmensaje' id='txtmensaje' placeholder='Escriba aqui su mensaje' />
<button type="button" id="btnenviar">Enviar</button>
</body>
</html>