Paso 4: Let s rock esta toma!
Ahora que ya tenemos un servidor web básico para trabajar con, vamos a espolvorear en magia WebSocket. Estamos utilizando Socket.IO para gestionar nuestra comunicación WebSocket, que juega muy bien con el Express.
Reemplace el contenido de su app.js con el siguiente código. Cambios se comentan para explicar lo que están haciendo.
var express = require('express') var app = express() var server = require('http').Server(app) var io = require('socket.io')(server) // pass our http server to Socket.IO app.use(express.static(__dirname + '/public')) server.listen(8080) io .of('/soundsocket') // establish a route to connect to using the Socket.IO client .on('connection', function (socket) { console.log('client connected') // each time a client establishes a connection, log a message to the console that the app is running on (on the Edison). }) Ahora necesitamos integrar Socket.IO en el archivo HTML que estamos sirviendo. Abrir el archivo 'public/index.html' y pegue el siguiente código, donde 0.0.0.0 es la dirección IP de su Edison.
<html> <script src="https://cdn.socket.io/socket.io-1.3.4.js"></script> <script type="text/javascript"> var socketConnection = io.connect('http://0.0.0.0:8080/soundsocket') socketConnection.on('connect', function () { console.log('connected to socket') }) </script> <body> Hello world! </body> </html> Nota: Estamos eligiendo usar script alojado de Socket.IO, que es una conveniencia para este tutorial. En la práctica, probablemente desee acoger este archivo usted mismo.
Cometer y empujar los cambios, baje en el Edison, después vuelva a ejecutar la aplicación, como se indica en el último paso.
En este punto, deben ser capaces de navegar a la dirección IP de su Edison en puerto 8080 y debería ver log de consola de su Edison que un cliente se ha conectado. Además, si usted enciende el Web Inspector, debería ver un mensaje conectado a esa consola, así.
Tenemos una conexión de socket de trabajo, sin embargo no realmente enviamos algo sobre el zócalo aún. Vamos a cambiar eso ahora. Abrir el archivo 'app.js' y agregue el código siguiente después de iniciar sesión el mensaje 'cliente conectado'.
socket.emit('test_message', 'some data') En el archivo index.html, agregue el código siguiente directamente antes de cierre de la escritura de la etiqueta.
socketConnection.on('test_message', function(data) { console.log('received data:', data) }) Cometer y empujar los cambios, baje en el Edison, después vuelva a ejecutar la aplicación.
Si vuelve a cargar tu página, nuestra aplicación emitirá un mensaje de socket llamado 'test_message' con un cuerpo de 'algunos datos'. Para comprobar que todo funciona como se esperaba, abrir el Web Inspector y compruebe que nuestro mensaje fue conectado a la consola.
Esto nos da una base para la comunicación en tiempo real, y ahora estamos listos para integrar algunos botones y sensores en el proyecto.
