Diferència entre revisions de la pàgina «Sol websockets clientes»
De wikiserver
(Es crea la pàgina amb «'''CLIENTE''' <source lang="html"> <!DOCTYPE html> <html> <head> <script src="./node_modules/socket.io-client/dist/socket.io.js"></script> <script> var sock...».) |
|||
| Línia 7: | Línia 7: | ||
<script> | <script> | ||
var socket = io(); | var socket = io(); | ||
| − | socket.on('broadcast',function(data) { | + | socket.on('broadcast',function(data) { |
document.body.innerHTML = ''; | document.body.innerHTML = ''; | ||
document.write(data.description); | document.write(data.description); | ||
| Línia 18: | Línia 18: | ||
'''SERVIDOR''' | '''SERVIDOR''' | ||
<source lang="javascript"> | <source lang="javascript"> | ||
| − | |||
var express = require('express'); | var express = require('express'); | ||
var app = express(); | var app = express(); | ||
| Línia 25: | Línia 24: | ||
var io = require('socket.io')(server); | var io = require('socket.io')(server); | ||
| − | app.use(express.static(path.join(__dirname, '/'))); //Para el servicio de archivos | + | 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(3000, function () { | ||
| + | console.log('listening on localhost:3000'); | ||
| + | }); | ||
var clients = 0; | var clients = 0; | ||
| − | io.on('connection', function(socket) { | + | io.on('connection', function (socket) { |
clients++; | clients++; | ||
| − | io.sockets.emit('broadcast',{ description: clients + ' clientes conectados!'}); | + | console.log('Usuario conectado con Id ' + socket.id); //muestra el id de esa pestaña del navegador |
| + | io.sockets.emit('broadcast', { | ||
| + | description: clients + ' clientes conectados pero ha habido una nueva conexión!' | ||
| + | }); //hace un broadcast a todos los usuarios que la habitación | ||
| + | |||
socket.on('disconnect', function () { | socket.on('disconnect', function () { | ||
clients--; | clients--; | ||
| − | io.sockets.emit('broadcast',{ description: clients + ' | + | console.log('Usuario Desconectado con Id ' + socket.id); //muestra el id de esa pestaña del navegador |
| + | io.sockets.emit('broadcast', { | ||
| + | description: clients + ' clientes conectados pero ha habido una desconexión!' | ||
| + | });//hace un broadcast a todos los usuarios que la habitación | ||
}); | }); | ||
}); | }); | ||
| − | + | ||
| − | |||
| − | |||
</source> | </source> | ||
Revisió de 16:48, 19 maig 2020
CLIENTE
<!DOCTYPE html>
<html>
<head>
<script src="./node_modules/socket.io-client/dist/socket.io.js"></script>
<script>
var socket = io();
socket.on('broadcast',function(data) {
document.body.innerHTML = '';
document.write(data.description);
});
</script>
<body>Hello world</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(3000, function () {
console.log('listening on localhost:3000');
});
var clients = 0;
io.on('connection', function (socket) {
clients++;
console.log('Usuario conectado con Id ' + socket.id); //muestra el id de esa pestaña del navegador
io.sockets.emit('broadcast', {
description: clients + ' clientes conectados pero ha habido una nueva conexión!'
}); //hace un broadcast a todos los usuarios que la habitación
socket.on('disconnect', function () {
clients--;
console.log('Usuario Desconectado con Id ' + socket.id); //muestra el id de esa pestaña del navegador
io.sockets.emit('broadcast', {
description: clients + ' clientes conectados pero ha habido una desconexión!'
});//hace un broadcast a todos los usuarios que la habitación
});
});
