Archivos de la categoría node.js

Servir archivos estáticos en Node.js

Hola de nuevo.

Hoy vamos a mostrar como cargar archivos estáticos en node.js. En post anteriores vimos como crear un hola mundo y como rutear peticiones. Sin embargo nos interesa poder cargar páginas html estáticas y además poder cargar archivos js y css.

En los ejemplos anteriores si se  escribía html incluyendo archivos js o css estos no se cargaban porque cada petición al servidor la recoge el modulo server.js y  las trataba como una petición cualquiera. Ahora solucionaremos esto.

Vamos a crear un nuevo proyecto en blanco para probar esto.

Primero vamos a crear el archivo principal que simplemente incluye  al archivo server.js y pone en marcha el servidor, lo llamaremos index.js:

var server = require("./server.js");
server.start();

Bien y ahora vamos a crear el archivo server.js, que será como el que hemos visto en los posts anteriores pero añadiendo algunas cosas:

var http = require('http');
var fs = require('fs'); // sistema de archivo
var path = require('path'); // path
function start() {
  function onRequest(request, response){
    var ruta = '.' + ((request.url=='/') ? '/index.html' : request.url);
    var extension =path.extname(ruta); // obtiene la extension del archivo 
    var contentType = 'text/html';
    switch (extension){ 
        case '.js':   
             contentType = 'text/javascript';   
             break;   
        case '.css':   
             contentType = 'text/css';
    }
    path.exists(ruta,function(bExist){ 
        if(bExist) 
        { 
          fs.readFile(ruta, function(bError,content){ 
              if(bError)  {
                  response.writeHead(500); 
                  response.end(); 
              } 
              else  { 
                  response.writeHead(200,{'content-Type' : contentType});
                  response.end(content); 
              } 
          });
        }
        else{ 
            response.writeHead(404); response.end();
        }
      });
    }

  http.createServer(onRequest).listen(8888);
}
exports.start = start;

Analicemos el código:

Primero incluimos como siempre el modulo http.

Después incluimos el módulo fs(file system)  para trabajar con el sistema de archivos y requerimos también el modulo path para poder trabajar con las rutas.

En la  función onRequest recogemos la ruta de la url:

var ruta = '.' + ((request.url=='/') ? '/index.html' : request.url);

Si está vacía la variable ruta tomará por defecto index.html y si no lo que hallamos indicado en la url.

Después miramos la extensión del archivo que se ha pedido y establecemos el content-type en función de este:

var extension =path.extname(ruta); // obtiene la extension del archivo 
    var contentType = 'text/html';
    switch (extension){ 
        case '.js':   
             contentType = 'text/javascript';   
             break;   
        case '.css':   
             contentType = 'text/css';
    }

 

Por último si existe la ruta escribimos las cabeceras indicando el content-type y volcamos el contenido del archivo con response.end(content) o lanzamos una cabecera 404 en caso de no existir o una 500 caso de error al leer el archivo.

path.exists(ruta,function(bExist){ 
        if(bExist) 
        { 
          fs.readFile(ruta, function(bError,content){ 
              if(bError)  {
                  response.writeHead(500); 
                  response.end(); 
              } 
              else  { 
                  response.writeHead(200,{'content-Type' : contentType});
                  response.end(content); 
              } 
          });
        }
        else{ 
            response.writeHead(404); response.end();
        }
      });

 

Bien pues con esto ya estamos preparados para servir archivos estáticos.

Para probarlo vamos a crear los siguientes archivos en nuestro proyecto de prueba:

Un archivo llamado index.html que se cargará por defecto cuando no indiquemos nada:

<html>
 <head>
 <title>Archivos estáticos en Node.js</title></head>
 <body>
 <h1>Soy el archivo index.html</h1>
 </body>
</html>

Un archivo de prueba que llamaremos hola.html:

<html>
 <head>
 <title>Archivos estáticos en Node.js</title>
 <script type="text/javascript" src="script.js"></script>
 <link rel="stylesheet" href="style.css" media="all" />
 </head>
 <body>
 <h1>Soy el archivo Hola.html</h1>
 </body>
</html>

Un archivo js que unicamente contendrá un alert para comprobar  que se ha cargado correctamente, lo llamaremos script.js:

alert('Hola');

Un archivo css que simplemente pondrá color Rojo de fondo al h1 y que llamaremos style.css:

h1 { background-color: red }

Si escribimos en la barra de direcciones de nuestro navegador localhost:8888 sin nada por detrás nos cargara index.html por defecto.

Sin embargo si escribimos localhost:8888/hola.html cargará el archivo hola.html y como este a su vez incluye el archivo style.css y el archivo js script.js mostrará el alert ‘Hola’ y el texto ‘Soy el archivo Hola.html’ con el fondo de color rojo.

Eso es todo por hoy.

Rutear peticiones en node.js

Hola a todos:

Hoy vamos a ver como rutear peticiones en node.js.

Para poder acceder a diferentes partes del código dependiendo de la petición HTTP recibida, debemos obtener la url y los posibles parámetros GET/POST.

Toda la información sobre la petición se encuentra en el objeto request que recibimos como parámetro en la función onRequest.

Para extraer esta información necesitamos utilizar el módulo url para extraer la ruta y el módulo querystring para obtener los parámetros pasados por GET o por POST.

Vano a modificar el archivo server.js del post anterior y añadimos la obtención de la url

var http = require("http");
var url = require("url");

function start()
{
  function onRequest(request, response)
  {
    response.writeHead(200, {"Content-Type": "text/html"});
    var pathname = url.parse(request.url).pathname;
    var query = url.parse(request.url,true).query;
    var id = query.id;
    response.write("Petición para " + pathname + " recibida con id="+id);
   response.end();
  }
  http.createServer(onRequest).listen(8888);
}
exports.start = start; 

En la variable pathname obtenemos la ruta URL requerida, por lo que podemos tomar decisiones sobre lo que hacer en función de la ruta obtenida.

Por ejemplo si escribimos en la barra de direcciones del navegador http://localhost:8888/productos/gafas/?id=12 la variable pathname contendrá /productos/gafas/ , la variable id valdrá 12 y en el navegador se mostrará el siguiente mensaje: “Petición para /productos/gafas/ recibida con id=12”.

De esta manera podemos tomar  decisiones en función de lo que recibimos como parámetros en la url.

Crear nuestros propios módulos en Node.js

Hola a todos:

En el post anterior vimos como instalar node.js y crear nuestro primer hola mundo. Hoy veremos como crear módulos en nodejs.

Para crear un módulo debemos generar una función, en este caso llamada inicio y después exportarla utilizando exports.nombre_modulo = nombre_funcion.

Por ejemplo podemos modificar el archivo server.js que vimos en el post anterior  para que sea un módulo de la siguiente mánera:

var http = require("http");

function start(){
  function onRequest(request, response){
    response.writeHead(200, {"Content-Type":"text/html"});
    response.write("Hola Mundo");
    response.end();
}
http.createServer(onRequest).listen(8888);}

exports.start = start;

Y luego generamos un archivo llamado index.js y llamamos al módulo que acabamos de crear de la siguiente manera:

var server = require("./server");
server.start();

 

Ahora podemos poner en marcha el servidor con nuestra web ejecutando directamente el archivo index.js:

node index.js

 

Instalación y Hola Mundo en Node.js

Hola a todos.

Hoy vamos a ver como hacer el típico hola mundo en node.js.

Lo primero que necesitamos es instalar node.js en nuestro sistema.

Si entramos en la página oficial https://nodejs.org/ veremos un botón INSTALL que detecta automáticamente el sistema operativo desde el cual accedemos y nos descarga el archivo correspondiente en cada caso.   Si estas trabajando desde Windows o desde MAC solo tienes que descargar el archivo, ejecutarlo y seguir los pasos para instalarlo. En linux se descarga un paquete que hay que compilarlo según la distribución que tengas instalada. Si estas trabajando en ubuntu o alguno de sus derivados puedes instalarlo de manera sencilla desde el repositorio de terceros de Chris Lea ejecutando los siguientes comandos:

sudo apt-get install python-software-properties
sudo add-apt-repository ppa:chris-lea/node.js
sudo apt-get update
sudo apt-get install nodejs

Si estas acostumbrado a trabajar en php o cualquier otro lenguaje de servidor sabrás que se necesita un servidor web como por ejemplo apache para poder responder a las peticiones y servir las paginas que generemos, sin embargo en node.js no necesitamos un servidor web como tal si no que  nosotros nos tenemos que encargar de gestionar las peticiones, puede parecer complicado, pero es realmente sencillo y rápido.

Pasemos a la práctica:

Crea una carpeta donde mejor consideres  para guardar los archivos que vamos a crear en node.js y crea dentro un nuevo archivo en blanco que llamaremos server.js

A continuación edita el archivo que acabamos de crear e introduce las siguientes lineas de código:

var http = require("http");
http.createServer(function(request, response) {
response.writeHead(200, {"Content-Type": "text/html"});
response.write("Hola Mundo");
response.end();
}).listen(8888);

La primera línea require, requiere al módulo http que viene incluido con Node.js y lo asigna a la variable http.

Luego llamamos a la función createServer que forma parte del módulo http. Esta función retorna un objeto que contiene un método llamado listen al cual le asignamos el el número de puerto en que nuestro servidor HTTP va a escuchar, en este caso el 8888.

Vemos que a la función createServer le pasamos como parámetro una función que a su vez recibe dos parametros: request y response.

En este caso solo nos interesa response, que es un objeto que contiene varios métodos:

Con writeHead le indicamos que escriba las cabeceras y le indicamos que el  Content-Type es  “text/html”.

Después escribimos el contenido de la página, en este caso la frase “Hola Mundo” con response.write. Esta función sería similar al echo de php.

Y por ultimo le indicamos que hemos terminado de escribir el contenido con respose.end();

Para ejecutar el servidor que hemos creado tenemos que abrir la consola de comandos (cmd en windows) , situarnos en la carpeta donde se encuentra nuestro archivo y ejecutarlo escribiendo el comando node seguido de el nombre del archivo que queremos ejecutar:

node server.js

Ahora si escribimos en la barra de direcciones de nuestro navegador http://localhost:8888/ nos muestra una preciosa página con ese texto tan original,  profundo y elaborado llamado “Hola Mundo” ;-P.

Este ha sido nuestro primer acercamiento a node.js.

En posteriores entradas aprenderemos mas cosas sobre node.js.