Archivo 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.