Diferència entre revisions de la pàgina «Sol websockets random»
De wikiserver
(Es crea la pàgina amb «<source lang="html"> <!DOCTYPE html> <html> <head> <!-- Este script no existe!, y est� bien que as� sea, ya que lo genera SocketIO autom�ticamente...».) |
|||
| (Hi ha una revisió intermèdia del mateix usuari que no es mostren) | |||
| Línia 1: | Línia 1: | ||
| + | '''cliente''' | ||
| + | |||
<source lang="html"> | <source lang="html"> | ||
<!DOCTYPE html> | <!DOCTYPE html> | ||
<html> | <html> | ||
<head> | <head> | ||
| − | |||
| − | |||
<script src="./node_modules/socket.io-client/dist/socket.io.js"></script> | <script src="./node_modules/socket.io-client/dist/socket.io.js"></script> | ||
| Línia 35: | Línia 35: | ||
</source> | </source> | ||
| + | '''servidor''' | ||
<source lang="javascript"> | <source lang="javascript"> | ||
var express = require('express'); | var express = require('express'); | ||
Revisió de 13:56, 26 nov 2017
cliente
<!DOCTYPE html>
<html>
<head>
<script src="./node_modules/socket.io-client/dist/socket.io.js"></script>
<script type="text/javascript">
// Nos conectamos al WebSocket
var socket = io.connect('http://localhost:8080', { 'forceNew': true });
// Nos suscribimos al mensaje de bienvenida
// que creamos en el servidor
socket.on('bienvenida', function (bienvenida) {
document.write(bienvenida.digo);
// Una vez que nos saluda el servidor
// Le enviamos un mensaje pidiendo un random
// cada 5 segundos (5000 milisegundos)
socket.emit('quiero un random', 5000);
});
// Por otro lado nos suscribimos al mensaje del
// del servidor para el n�mero random que nos va a enviar
socket.on('toma un random', function (data) {
console.log(data.numero);
});
</script>
</head>
<body>
Página web
<body/>
</html>servidor
var express = require('express');
var app = express();
var path = require('path');
var server = require('http').Server(app);
var io = require('socket.io')(server);
app.use(express.static(path.join(__dirname, '/'))); //Para el servicio de archivos estáticos como, por ejemplo, imágenes, archivos CSS y archivos JavaScript,
server.listen(8080, function() { ////Pondremos el servidor a escuchar en localhost con el puerto 8080
console.log('Servidor corriendo en http://localhost:8080');
});
// nos suscribimos al evento de socketIO cuando
// un cliente se conecta por WebSockets
io.sockets.on('connection', function (socket) {
// este callback va a ser llamado cuando tenemos
// un nuevo cliente y en el argumento 'socket'
// vamos a tener nuestro 'enganche' a ese cliente
// apenas se conecta, le mandamos un mensaje
// de bienvenida haciendo un 'emit' con un nombre
// para el mensaje y un json con los datos
socket.emit('bienvenida', { digo: 'Hola alumno de La Merce!' });
// nos suscribimos a un mensaje que nos puede
// enviar el cliente.
socket.on('quiero un random', function (cada_cuanto) {
setInterval(function(){
var rnd = Math.floor((Math.random()*1000)+1);
socket.emit('toma un random', { numero: rnd })
}, cada_cuanto);
});
});
