in

Node.js – Express Framework

nodejs sample

Descripción general exprés

Express es un marco de aplicación web Node.js mínimo y flexible que proporciona un conjunto sólido de funciones para desarrollar aplicaciones web y móviles. Facilita el rápido desarrollo de aplicaciones web basadas en Node. A continuación se muestran algunas de las características principales del marco Express:

  • Permite configurar middlewares para responder a solicitudes HTTP.

  • Define una tabla de enrutamiento que se utiliza para realizar diferentes acciones basadas en el método HTTP y la URL.

  • Permite renderizar páginas HTML de forma dinámica basándose en el paso de argumentos a las plantillas.

Instalación de Express

En primer lugar, instale el marco Express globalmente usando NPM para que pueda usarse para crear una aplicación web usando el terminal de nodo.

$ npm install express --save

El comando anterior guarda la instalación localmente en el módulos_nodo directorio y crea un directorio express dentro de node_modules. Debe instalar los siguientes módulos importantes junto con express –

  • analizador corporal – Este es un middleware de node.js para manejar datos de formularios codificados en formato JSON, Raw, Text y URL.

  • analizador de cookies – Analizar el encabezado de la cookie y completar req.cookies con un objeto codificado por los nombres de las cookies.

  • multer – Este es un middleware de node.js para manejar multipart / form-data.

$ npm install body-parser --save
$ npm install cookie-parser --save
$ npm install multer --save

Hola mundo Ejemplo

A continuación se muestra una aplicación Express muy básica que inicia un servidor y escucha en el puerto 8081 para la conexión. Esta aplicación responde con Hola Mundo! para solicitudes a la página de inicio. Para cualquier otro camino, responderá con un 404 No encontrado.

var express = require('express');
var app = express();

app.get('/', function (req, res) {
   res.send('Hello World');
})

var server = app.listen(8081, function () {
   var host = server.address().address
   var port = server.address().port
   
   console.log("Example app listening at http://%s:%s", host, port)
})

Guarde el código anterior en un archivo llamado server.js y ejecútelo con el siguiente comando.

$ node server.js

Verá el siguiente resultado:

Example app listening at http://0.0.0.0:8081

Abra http://127.0.0.1:8081/ en cualquier navegador para ver el siguiente resultado.

Primera aplicación

Solicitar respuesta

La aplicación Express utiliza una función de devolución de llamada cuyos parámetros son solicitud y respuesta objetos.

app.get('/', function (req, res) {
   // --
})
  • Objeto de solicitud: el objeto de solicitud representa la solicitud HTTP y tiene propiedades para la cadena de consulta de solicitud, parámetros, cuerpo, encabezados HTTP, etc.

  • Objeto de respuesta: el objeto de respuesta representa la respuesta HTTP que envía una aplicación Express cuando recibe una solicitud HTTP.

Puedes imprimir req y res objetos que proporcionan mucha información relacionada con la solicitud y respuesta HTTP, incluidas cookies, sesiones, URL, etc.

Enrutamiento básico

Hemos visto una aplicación básica que atiende solicitudes HTTP para la página de inicio. El enrutamiento se refiere a determinar cómo responde una aplicación a la solicitud de un cliente a un punto final en particular, que es un URI (o ruta) y un método de solicitud HTTP específico (GET, POST, etc.).

Ampliaremos nuestro programa Hello World para manejar más tipos de solicitudes HTTP.

var express = require('express');
var app = express();

// This responds with "Hello World" on the homepage
app.get('/', function (req, res) {
   console.log("Got a GET request for the homepage");
   res.send('Hello GET');
})

// This responds a POST request for the homepage
app.post('/', function (req, res) {
   console.log("Got a POST request for the homepage");
   res.send('Hello POST');
})

// This responds a DELETE request for the /del_user page.
app.delete('/del_user', function (req, res) {
   console.log("Got a DELETE request for /del_user");
   res.send('Hello DELETE');
})

// This responds a GET request for the /list_user page.
app.get('/list_user', function (req, res) {
   console.log("Got a GET request for /list_user");
   res.send('Page Listing');
})

// This responds a GET request for abcd, abxcd, ab123cd, and so on
app.get('/ab*cd', function(req, res) {   
   console.log("Got a GET request for /ab*cd");
   res.send('Page Pattern Match');
})

var server = app.listen(8081, function () {
   var host = server.address().address
   var port = server.address().port
   
   console.log("Example app listening at http://%s:%s", host, port)
})

Guarde el código anterior en un archivo llamado server.js y ejecútelo con el siguiente comando.

$ node server.js

Verá el siguiente resultado:

Example app listening at http://0.0.0.0:8081

Ahora puede probar diferentes solicitudes en http://127.0.0.1:8081 para ver el resultado generado por server.js. A continuación se muestran algunas capturas de pantalla que muestran diferentes respuestas para diferentes URL.

Pantalla que se muestra de nuevo http://127.0.0.1:8081/list_user

Segunda aplicación

Pantalla que se muestra de nuevo http://127.0.0.1:8081/abcd

Tercera aplicación

Pantalla que se muestra de nuevo http://127.0.0.1:8081/abcdefg

Cuarta aplicación

Entrega de archivos estáticos

Express proporciona un middleware integrado express.static para servir archivos estáticos, como imágenes, CSS, JavaScript, etc.

Simplemente necesita pasar el nombre del directorio donde guarda sus activos estáticos, al express.static middleware para comenzar a servir los archivos directamente. Por ejemplo, si mantiene sus imágenes, archivos CSS y JavaScript en un directorio llamado público, puede hacer esto:

app.use(express.static('public'));

Conservaremos algunas imágenes en public / images subdirectorio de la siguiente manera:

node_modules
server.js
public/
public/images
public/images/logo.png

Modifiquemos la aplicación «Hello Word» para agregar la funcionalidad para manejar archivos estáticos.

var express = require('express');
var app = express();

app.use(express.static('public'));

app.get('/', function (req, res) {
   res.send('Hello World');
})

var server = app.listen(8081, function () {
   var host = server.address().address
   var port = server.address().port

   console.log("Example app listening at http://%s:%s", host, port)
})

Guarde el código anterior en un archivo llamado server.js y ejecútelo con el siguiente comando.

$ node server.js

Ahora abra http://127.0.0.1:8081/images/logo.png en cualquier navegador y observe el siguiente resultado.

Quinta aplicación

Método GET

Aquí hay un ejemplo simple que pasa dos valores usando el método HTML FORM GET. Vamos a usar process_get enrutador dentro de server.js para manejar esta entrada.

<html>
   <body>
      
      <form action = "http://127.0.0.1:8081/process_get" method = "GET">
         First Name: <input type = "text" name = "first_name">  <br>
         Last Name: <input type = "text" name = "last_name">
         <input type = "submit" value = "Submit">
      </form>
      
   </body>
</html>

Guardemos el código anterior en index.htm y modifiquemos server.js para manejar las solicitudes de la página de inicio, así como la entrada enviada por el formulario HTML.

var express = require('express');
var app = express();

app.use(express.static('public'));
app.get("http://www.tutorialspoint.com/index.htm", function (req, res) {
   res.sendFile( __dirname + "/" + "index.htm" );
})

app.get('/process_get', function (req, res) {
   // Prepare output in JSON format
   response = {
      first_name:req.query.first_name,
      last_name:req.query.last_name
   };
   console.log(response);
   res.end(JSON.stringify(response));
})

var server = app.listen(8081, function () {
   var host = server.address().address
   var port = server.address().port
   
   console.log("Example app listening at http://%s:%s", host, port)
})

Accediendo al documento HTML usando http://127.0.0.1:8081/index.htm generará el siguiente formulario –


Ahora puede ingresar el nombre y apellido y luego hacer clic en el botón enviar para ver el resultado y debería devolver el siguiente resultado:

{"first_name":"John","last_name":"Paul"}

Método POST

Aquí hay un ejemplo simple que pasa dos valores usando el método HTML FORM POST. Vamos a usar process_get enrutador dentro de server.js para manejar esta entrada.

<html>
   <body>
      
      <form action = "http://127.0.0.1:8081/process_post" method = "POST">
         First Name: <input type = "text" name = "first_name"> <br>
         Last Name: <input type = "text" name = "last_name">
         <input type = "submit" value = "Submit">
      </form>
      
   </body>
</html>

Guardemos el código anterior en index.htm y modifiquemos server.js para manejar las solicitudes de la página de inicio, así como la entrada enviada por el formulario HTML.

var express = require('express');
var app = express();
var bodyParser = require('body-parser');

// Create application/x-www-form-urlencoded parser
var urlencodedParser = bodyParser.urlencoded({ extended: false })

app.use(express.static('public'));
app.get("http://www.tutorialspoint.com/index.htm", function (req, res) {
   res.sendFile( __dirname + "/" + "index.htm" );
})

app.post('/process_post', urlencodedParser, function (req, res) {
   // Prepare output in JSON format
   response = {
      first_name:req.body.first_name,
      last_name:req.body.last_name
   };
   console.log(response);
   res.end(JSON.stringify(response));
})

var server = app.listen(8081, function () {
   var host = server.address().address
   var port = server.address().port
   
   console.log("Example app listening at http://%s:%s", host, port)
})

Accediendo al documento HTML usando http://127.0.0.1:8081/index.htm generará el siguiente formulario –


Ahora puede ingresar el nombre y apellido y luego hacer clic en el botón enviar para ver el siguiente resultado:

{"first_name":"John","last_name":"Paul"}

Subir archivo

El siguiente código HTML crea un formulario de carga de archivos. Este formulario tiene el atributo de método establecido en CORREO y el atributo enctype se establece en multiparte / form-data

<html>
   <head>
      <title>File Uploading Form</title>
   </head>

   <body>
      <h3>File Upload:</h3>
      Select a file to upload: <br />
      
      <form action = "http://127.0.0.1:8081/file_upload" method = "POST" 
         enctype = "multipart/form-data">
         <input type="file" name="file" size="50" />
         <br />
         <input type = "submit" value = "Upload File" />
      </form>
      
   </body>
</html>

Guardemos el código anterior en index.htm y modifiquemos server.js para manejar las solicitudes de la página de inicio y la carga de archivos.

var express = require('express');
var app = express();
var fs = require("fs");

var bodyParser = require('body-parser');
var multer  = require('multer');

app.use(express.static('public'));
app.use(bodyParser.urlencoded({ extended: false }));
app.use(multer({ dest: '/tmp/'}));

app.get("http://www.tutorialspoint.com/index.htm", function (req, res) {
   res.sendFile( __dirname + "/" + "index.htm" );
})

app.post('/file_upload', function (req, res) {
   console.log(req.files.file.name);
   console.log(req.files.file.path);
   console.log(req.files.file.type);
   var file = __dirname + "/" + req.files.file.name;
   
   fs.readFile( req.files.file.path, function (err, data) {
      fs.writeFile(file, data, function (err) {
         if( err ) {
            console.log( err );
            } else {
               response = {
                  message:'File uploaded successfully',
                  filename:req.files.file.name
               };
            }
         
         console.log( response );
         res.end( JSON.stringify( response ) );
      });
   });
})

var server = app.listen(8081, function () {
   var host = server.address().address
   var port = server.address().port
   
   console.log("Example app listening at http://%s:%s", host, port)
})

Accediendo al documento HTML usando http://127.0.0.1:8081/index.htm generará el siguiente formulario –

File Upload:
Select a file to upload: 

NOTE: This is just dummy form and would not work, but it must work at your server.

Galletas…

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Las 23 preguntas principales de la entrevista de JUnit (2021)

apple touch icon@2

linux – ¿Cómo funciona «cat