1. Introducción
En primer lugar, el sitio web oficial de Socket.io: http://socket.io
El sitio web oficial es muy conciso, e incluso no hay documentación de API, solo una simple "cómo usar" para referirse. Porque Socket.io es tan simple y fácil de usar como el sitio web oficial.
Entonces, ¿qué es Socket.io? Socket.io es una biblioteca WebSocket que incluye JS del lado del cliente y NodeJ del lado del servidor. Su objetivo es crear aplicaciones en tiempo real que se puedan usar en diferentes navegadores y dispositivos móviles. Elegirá automáticamente la mejor manera de realizar la aplicación de red en tiempo real en función del navegador de varios métodos, como WebSocket, Ajax Long Polling, Iframe Streaming, etc., que es muy conveniente y fácil de usar. Los navegadores compatibles son tan bajos como IE5.5, lo que debería satisfacer la mayoría de las necesidades.
2. Instalación e implementación
2.1 Instalación
En primer lugar, la instalación es muy simple, en el entorno node.js, solo una oración:
La copia del código es la siguiente:
NPM Instalar Socket.io
2.2 Combinando Express para construir un servidor
Express es un marco pequeño de aplicaciones web nodo.js, que a menudo se usa al construir servidores HTTP, por lo que se explica directamente con Socket.io y Express como ejemplos.
La copia del código es la siguiente:
var express = require ('express')
, App = Express ()
, servidor = require ('http'). CreateServer (APP)
, io = require ('Socket.io'). Listen (servidor);
servidor.listen (3001);
Si no usa Express, consulte Socket.io/#how-to-use
3. Método de uso básico
Se divide principalmente en dos piezas de código: lado del servidor y del lado del cliente, los cuales son muy simples.
Servidor (app.js):
La copia del código es la siguiente:
// Conecte el código anterior
app.get ('/', function (req, res) {
res.sendFile (__ dirname + '/index.html');});
io.sockets.on ('conexión', function (socket) {
Socket.emit ('News', {Hello: 'World'});
Socket.on ('Otro evento', function (Data) {
console.log (datos);
});
});
Primero, la función io.sockets.on acepta la "conexión" de cadena como el evento en el que el cliente inicia la conexión. Cuando la conexión es exitosa, se llama a la función de devolución de llamada con parámetros de socket. Cuando usamos Socket.io, básicamente manejamos las solicitudes de usuarios en esta función de devolución de llamada.
Lo más importante de Socket es emitir y encender. El primero envía (emite) un evento (el nombre del evento está representado por una cadena). El nombre del evento se puede personalizar, y hay algunos nombres de eventos predeterminados, seguidos de un objeto, indicando el contenido enviado al socket; Este último recibe un evento (el nombre del evento está representado por una cadena), seguido de una función de devolución de llamada que recibe la llamada del evento, donde los datos son los datos recibidos.
En el ejemplo anterior, enviamos el evento de noticias y recibimos el otro evento del evento, por lo que el cliente debería tener eventos de recepción y recepción correspondientes. Sí, el código del cliente es exactamente lo contrario y muy similar al servidor.
Cliente (Client.js)
La copia del código es la siguiente:
<script src = "/Socket.io/socket.io.js"> </script>
<script>
var Socket = io.connect ('http: // localhost');
Socket.on ('News', function (Data) {
console.log (datos);
Socket.emit ('Otro evento', {my: 'data'});
});
</script>
Hay dos cosas a tener en cuenta: la ruta Socket.io.js debe escribirse correctamente. Este archivo JS en realidad se coloca en la carpeta Node_Modules en el lado del servidor. Se redirigirá al solicitar este archivo. Por lo tanto, no se sorprenda de que este archivo no exista en el lado del servidor, pero por qué todavía funciona normalmente. Por supuesto, puede copiar el archivo Socket.io.js del lado del servidor a localmente y convertirlo en un archivo JS del lado del cliente, para que no tenga que solicitar este archivo JS desde el servidor de nodo cada vez, lo que mejora la estabilidad. El segundo punto es usar var socket = io.connect ('dirección de sitio web o ip'); Para obtener el objeto Socket, y luego puede usar el socket para enviar y recibir eventos. Con respecto al procesamiento del evento, el código anterior significa que después de recibir el evento "Noticias", los datos recibidos se imprimen y el evento "Otro evento" se envía al servidor.
Nota: El nombre de evento predeterminado incorporado, como "Desconectar" significa que la conexión del cliente está desconectada, "Mensaje" significa que se recibe el mensaje, etc. Para los nombres de eventos personalizados, intente no duplicar el nombre con los nombres de eventos predeterminados creados en Socket.io, para no causar problemas innecesarios.
4. Otras API comunes
1). Transmitido a todos los clientes: Socket.Broadcast.Emit ('Mensaje de transmisión');
2). Ingrese una habitación (¡muy fácil de usar! Es equivalente a un espacio de nombres, que se puede transmitir a una habitación específica sin afectar a los clientes en otras habitaciones o no en la habitación): Socket.JOIN ('Nombre de su habitación');
3). Mensaje de transmisión a una habitación (el remitente no puede recibir el mensaje): Socket.Broadcast.TO ('Nombre de su habitación'). EMIT ('Mensaje de habitación de transmisión');
4). Mensajes de transmisión a una habitación (incluido el remitente puede recibir mensajes) (esta API pertenece a io.sockets): io.sockets.in ('Otra sala de habitaciones'). EMIT ('Mensaje de sala de transmisión');
5). Force WebSocket Communication: (Cliente) Socket.send ('Hi'), (servidor) Use Socket.on ('Mensaje', Funcion (Data) {}) para recibir.
5. Construya una sala de chat con socket.io
Finalmente, terminamos este artículo con un ejemplo simple. El uso de Socket.io para construir una sala de chat es de aproximadamente 50 líneas de código, y el efecto de chat en tiempo real también es muy bueno. Se publican los siguientes códigos clave:
Servidor (Socketchat.js)
La copia del código es la siguiente:
// Un diccionario para la conexión del cliente, cuando un cliente se conecta al servidor,
// se generará un socketid único, y el diccionario mantendrá la asignación de SocketID a la información del usuario (apodo, etc.)
var conectionList = {};
exports.startchat = function (io) {
io.sockets.on ('conexión', function (socket) {
// Guardar socketid y nombre de usuario cuando la conexión del cliente
var Socketid = Socket.id;
ConnectionList [SocketID] = {
Socket: enchufe
};
// El usuario ingresa al evento de la sala de chat y transmite su nombre de usuario a otros usuarios en línea
Socket.on ('Join', function (Data) {
Socket.broadcast.emit ('Broadcast_Join', Data);
ConnectionList [SocketID] .Username = data.Username;
});
// El usuario deja el incidente de la sala de chat y transmite su partida a otros usuarios en línea
socket.on ('disconnect', function () {
if (ConnectionList [SocketID] .Username) {
Socket.broadcast.emit ('Broadcast_Quit', {
Nombre de usuario: ConnectionList [SocketID]. UserName
});
}
Eliminar ConnectionList [SocketID];
});
// Incidente del habla del usuario, transmite el contenido de su discurso a otros usuarios en línea
Socket.on ('say', function (data) {
Socket.broadcast.emit ('Broadcast_say', {
Nombre de usuario: ConnectionList [SocketID]. UserName,
Texto: Data.text
});
});
})
};
Cliente (SocketchatClient.js)
La copia del código es la siguiente:
var Socket = io.connect ('http: // localhost');
// Después de conectarse al servidor, envíe un evento "Únete" de inmediato y dígale a otros su nombre de usuario
Socket.emit ('unirse', {
Nombre de usuario: 'Nombre de usuario jeje'
});
// Después de recibir la transmisión de unirse a la sala de chat, el mensaje se mostrará
Socket.on ('Broadcast_Join', function (Data) {
console.log (data.Username + 'agregado a la sala de chat');
});
// Después de recibir la transmisión que sale de la sala de chat, se muestra el mensaje
Socket.on ('Broadcast_Quit', function (data) {
console.log (data.Username + 'dejar la sala de chat');
});
// Después de recibir un mensaje enviado por otra persona, el mensaje se mostrará
Socket.on ('broadcast_say', function (data) {
console.log (data.username + 'say:' + data.text);
});
// Aquí suponemos que hay un cuadro de texto TextAREA y un botón de envío.
// Evento de enlace con jQuery
$ ('. Btn-send'). Click (función (e) {
// Recibe texto del cuadro de texto
var text = $ ('textArea'). val ();
// Envíe un evento decir y el servidor lo transmitirá cuando lo reciba.
Socket.emit ('say', {
Nombre de usuario: 'Nombre de usuario jeje'
Texto: texto
});
});
Esta es una simple demostración de la sala de chat que puedes expandir como quieras. Socket.io es básicamente el procesamiento de envío y recepción de varios eventos, y la idea es muy simple.