29Oct

Cómo depurar Javascript ejecutándose sobre NodeJS en un contenedor Docker

En esta guía mostraremos como conectar el depurador de Visual Studio Code de Javascript con el proceso de NodeJS dentro del contenedor y poder utilizar la ejecución paso a paso sobre el código…

Descripción del problema

Disponemos de un contenedor con NodeJS con el que ejecutamos una aplicación ExpressJS y queremos poder depurar el programa con Visual Studio Code. El motor de depuración por terminal está dentro del contenedor, por lo que solamente podemos ejecutarlo abriendo un proceso de bash dentro de él.

En esta guía mostraremos como conectar el depurador de Visual Studio Code de Javascript con el proceso de NodeJS dentro del contenedor y poder utilizar la ejecución paso a paso sobre el código.

El Proyecto ExpressJS

El proyecto usado como ejemplo esta como proyecto público en Github en el siguiente enlace:

Una vez descargado el proyecto es necesario construir las imagen y levantar el contenedor de NodeJS con los siguientes comandos:

sh build_images.sh
docker-compose up -d

Para entrar en el contenedor de Node ejecutamos:

docker exec -ti node_debug_sample bash

Instalamos las dependencias de NPM con:

npm install

Si ejecutamos el servidor de ExpressJS con el comando: node server.js y visitamos la url http://172.17.0.1:5000/ veremos una respuesta JSON con un token generado con el módulo UUID5 en pantalla:

El depurador de NodeJS

El depurador de NodeJS por defecto escucha conexiones en el puerto 5858. En el archivo de definición de los contenedores del ejemplo: docker-compose.yml, hemos abierto los puertos 5000 para la aplicación y 5858 para el depurador.

Hemos de ejecutar el servidor con la bandera de depuración para poder enlazar nuestro depurador de Visual Code Studio al proceso de NodeJS.

Para ejecutar el servidor en modo depuración iniciamos el proceso con el comando:

node --debug=5858 server.js

Cómo configurar VSC – Visual Studio Code para depurar el servidor ExpressJS

El archivo de proyecto .vscode/launch.json contiene la configuración necesaria para depurar el proceso. La configuración de la sección con el nombre Asociar nos permite conectar al depurador de NodeJS dentro del contenedor en el puerto 5858 el depurador de VSC:

Las propiedades localRoot y remoteRoot asocian el directorio de proyecto local con el directorio de proyecto dentro del contenedor.

Depurar con un Punto de Interrupción en el servidor

Creamos un punto de interrupción haciendo click dentro de la primera linea del controlador como muestra la siguiente imagen:

Abrimos el modo depuración:

Y asociamos el depurador el proceso interno del contenedor que ya está ejecutándose (el servidor en modo depuración):

Ahora ya una vez ejecutemos la vista en nuestro navegador entrando en http://172.17.0.1:5000/ el depurador se parará en el punto de ruptura y podremos acceder al estado de las variables para depurar el programa!

Repositorio Github con el código de Ejemplo: https://github.com/urodoz/depurar-javascript-con-vsc-en-docker

Leave a comment