¿Cómo crear conexiones WebSocket en Node.js?

Como Crear Conexiones Websocket En Node Js



WebSocket es básicamente un protocolo que utilizan los desarrolladores en su aplicación para permitir la comunicación dúplex completa entre el lado del cliente y el servidor. Este tipo de comunicación permite a los usuarios comunicarse con el servidor en tiempo real y sin demora. Hoy en día, este protocolo se utiliza en casi todas las aplicaciones web para brindar una mejor experiencia de usuario.

Este artículo ilustra el procedimiento para crear conexiones webSocket en Node.js.

¿Cómo crear conexiones WebSocket en Node.js?

La conexión WebSocket consta de dos partes: desarrollo en el lado del cliente y en el lado del servidor. También es necesario crear un sitio web ficticio que actúe como medio entre ambas partes. Al usarlo, los mensajes se transfieren desde ambos lados. Visite los pasos a continuación para la creación de WebSocket en NodeJs.







Paso 1: Configurar el entorno NodeJs

Con la ayuda del “ cd 'Comando, recorra la carpeta del proyecto y dentro de ella ejecute el comando' npm init -y ”para instalar los módulos predeterminados de NodeJs:



inicio npm - y

Después de ejecutar el comando anterior, el nuevo archivo llamado ' paquete.json Se crea ”que almacena la información básica relacionada con el proyecto:







Paso 2: Instalación del módulo WebSocket

Para utilizar el protocolo WebSocket el módulo llamado “ ws ”debe instalarse en el proyecto NodeJs. El comando para la instalación se inserta a continuación:



npm instala ws

El siguiente resultado muestra “ ws ”se ha instalado en el directorio NodeJs deseado:

Paso 3: configurar el servidor WebSocket

Para configurar el lado del servidor del protocolo webSocket, cree un nuevo ' .js 'Escriba el archivo dentro de la carpeta del proyecto con el nombre' lado del servidor ”e inserte el código que se indica a continuación:

constante wsObj = requerir ( 'ws' ) ;

constante ws = nuevo wsObj. Servidor ( { puerto : 3000 } ) ;

consola. registro ( 'El servidor Linuxhint se ha iniciado' ) ;

La explicación del código anterior es la siguiente:

  • Primero, con la ayuda del “ requerir() 'Método, el' ws 'El módulo que ya está instalado en la sección anterior se importa dentro del actual' servidorSide.js ' archivo.
  • A continuación, invoque el “ Servidor() 'Método utilizando el objeto del' ws 'Módulo llamado' wsObj ' y pase el número de puerto de ' 3000 ”para iniciar el servidor en el puerto especificado de Localhost.
  • Además, muestre algún mensaje aleatorio en la ventana de la consola para confirmar que el servidor se ha iniciado desde el extremo del servidor.

Paso 4: Configurar el cliente WebSocket

Crea otro archivo con el nombre “ lado del cliente ”para configurar el lado del cliente que se conecta al servidor. Inserte el siguiente código para configurar el lado del cliente básico que muestra un mensaje aleatorio cuando se conecta a través del servidor:

constante objeto = nuevo WebSocket ( 'ws://localhost:3000' ) ;

obj. agregarEventListener ( 'abierto' , ( ) => {

consola. registro ( '¡Estás conectado al servidor Linuxhint!' ) ;

} ) ;

La descripción del bloque de código anterior:

  • Primero, cree un nuevo objeto para el ' WebSocket() 'Protocolo que se escucha en el Localhost que tiene el número de puerto' 3000 ”.
  • Luego, almacene el nuevo objeto en la variable llamada ' objeto ”.
  • Después de eso, adjunte el detector de eventos de ' abierto ' con este ' objeto ”. Este detector de eventos ejecutará una función anónima cuando el servidor se cargue en Localhost con el número de puerto proporcionado.
  • La función muestra un mensaje aleatorio relacionado con la conexión en la consola.

Paso 5: Creación de una página web

Dentro del directorio del proyecto, cree un ' .html ' escriba el archivo que tiene el nombre de ' índice 'que contiene la estructura básica de HTML junto con la etiqueta de script única para importar el' clientSide.js ' archivo:

TIPO DE DOCUMENTO html >

< solo html = 'en' >

< cabeza >

  < metajuego de caracteres = 'UTF-8' >

  < título > Cliente título >

cabeza >

< cuerpo >

  < h1 > Sitio web de Linuxhint h1 >

  cuerpo >

  < script src = 'clienteLado.js' > guion >

HTML >

Paso 6: Ejecución

Abre el ' índice.html ”en la página web directamente desde el directorio. Luego, vaya a la terminal o al símbolo del sistema y ejecute el siguiente comando:

lado del servidor de nodo

El mensaje de salida muestra que el servidor se ha iniciado.

Ahora, sin cerrar el servidor, vaya a index.html y ábralo en el navegador web. Allí aparecerá el mensaje de conexión exitosa en la ventana de la consola:

El resultado muestra que se ha establecido la conexión entre el lado del cliente y el servidor. Este blog ha explicado el proceso de creación de la conexión webSocket en NodeJs.

Conclusión

Para crear una conexión webSocket en NodeJs, cree un nuevo proyecto de NodeJs e instale el ' ws 'Módulo ejecutando el' npm instala ws ' dominio. Ahora, cree un archivo para el lado del servidor y dentro de él importe el ' ws ”módulo. Utilice este módulo para crear un servidor WebSocket en el puerto ' 3000 ”. Cree otro archivo para el lado del cliente en el que necesite definir un nuevo objeto para ' WebSocket ' llamado ' objeto 'Y haz que escuche en el puerto' 3000 ”. Este blog ha ilustrado el procedimiento para establecer una conexión WebSocket en NodeJs.