Obtener cadenas de consulta y par谩metros en Express.js

    Introducci贸n

    Veremos c贸mo extraer informaci贸n de una URL en Express.js. Espec铆ficamente, 驴c贸mo extraemos informaci贸n de una cadena de consulta y c贸mo extraemos informaci贸n de los par谩metros de ruta de URL?

    En este art铆culo, supongo que tienes algo de experiencia con Node.js y creando Express.js servidores (o al menos simples). El resto lo explicaremos a lo largo del art铆culo.

    Extraer par谩metros de consulta

    Antes de comenzar, ser铆a 煤til comprender primero qu茅 es exactamente una cadena de consulta / par谩metro, y luego hablaremos sobre c贸mo podemos trabajar con ellos.

    Entonces, que es un par谩metro de consulta?

    En t茅rminos simples, una cadena de consulta es parte de una URL (Localizador uniforme de recursos) despu茅s del signo de interrogaci贸n (?). Est谩 destinado a enviar peque帽as cantidades de informaci贸n al servidor a trav茅s de la URL. Esta informaci贸n se usa generalmente como par谩metros para consultar una base de datos, o tal vez para filtrar resultados. Realmente depende de usted para qu茅 se usan.

    A continuaci贸n, se muestra un ejemplo de una URL con cadenas de consulta adjuntas:

    https://Pharos.sh.com/?page=2&limit=3
    

    Los par谩metros de consulta son los pares clave-valor reales como page y limit con valores de 2 y 3, respectivamente.

    Ahora, pasemos al primer prop贸sito principal de este art铆culo: c贸mo extraerlos de nuestro objeto de solicitud Express.

    Este es un caso de uso bastante com煤n en Express y en cualquier servidor HTTP, as铆 que espero que los ejemplos y la explicaci贸n que muestro aqu铆 sean claros.

    Ahora, tomando el mismo ejemplo de arriba:

    https://Pharos.sh.com/?page=2&limit=3
    

    Nos gustar铆a extraer tanto el page y limit par谩metros para que sepamos qu茅 art铆culos volver a la p谩gina que solicit贸 el usuario. Si bien los par谩metros de consulta se utilizan normalmente en GET solicitudes, todav铆a es posible verlas en POST y DELETE solicitudes, entre otras.

    Sus par谩metros de consulta se pueden recuperar de la query objeto en el solicitud objeto enviado a su ruta. Tiene la forma de un objeto en el que puede acceder directamente a los par谩metros de consulta que le interesan. En este caso, Express maneja todo el an谩lisis de URL por usted y expone los par谩metros recuperados como este objeto.

    Echemos un vistazo a un ejemplo de c贸mo obtenemos par谩metros de consulta en una ruta:

    const express = require('express');
    const bodyParser = require('body-parser');
    const url = require('url');
    const querystring = require('querystring');
    const Article = require('./models').Article;
    
    let app = express();
    app.use(bodyParser.urlencoded({ extended: false }));
    app.use(bodyParser.json());
    
    // Function to handle the root path
    app.get("https://Pharos.sh.com/", async function(req, res) {
    
        // Access the provided 'page' and 'limt' query parameters
        let page = req.query.page;
        let limit = req.query.limit;
    
        let articles = await Article.findAll().paginate({page: page, limit: limit}).exec();
    
        // Return the articles to the rendering engine
        res.render('index', {
            articles: articles
        });
    });
    
    let server = app.listen(8080, function() {
        console.log('Server is listening on port 8080')
    });
    

    En el ejemplo anterior, asumimos que page y limit los par谩metros siempre existen. Si ninguno de estos par谩metros se proporciona en la URL, recibir铆amos undefined para ambos page y limit en lugar.

    Extraer par谩metros de consulta sin Express

    Como beneficio adicional, quer铆a mostrarle c贸mo realizar el an谩lisis real por su cuenta en caso de que necesite extraer informaci贸n de una URL que no est茅 usando Express o cualquier otro marco web. Es bastante com煤n crear un servidor completamente simple usando el http m贸dulo, por lo que es bueno saberlo.

    Por suerte para usted, Node.js ya proporciona algunas bibliotecas centrales excelentes que tienen esta funcionalidad incorporada, por lo que es solo una cuesti贸n de require-ingresar el m贸dulo y llamar a algunas l铆neas de c贸digo.

    Aqu铆 hay un ejemplo usando el querystring y url paquetes.

    const url = require('url');
    const querystring = require('querystring');
    
    let rawUrl="https://Pharos.sh.com/?page=2&limit=3";
    
    let parsedUrl = url.parse(rawUrl);
    let parsedQs = querystring.parse(parsedUrl.query);
    
    // parsedQs = { page: '2', limit: '3' }
    

    Puede ver en este c贸digo que necesitamos dos pasos de an谩lisis para obtener los resultados que queremos.

    Analicemos esto un poco m谩s y mostremos qu茅 sucede exactamente en cada paso. Despu茅s de llamar url.parse(rawUrl) en nuestra URL, esto es lo que se nos devuelve:

    {
        protocol: 'https:',
        slashes: true,
        auth: null,
        host: 'Pharos.sh.com',
        port: null,
        hostname: 'Pharos.sh.com',
        hash: null,
        search: '?page=2&limit=3',
        query: 'page=2&limit=3',
        pathname: "https://Pharos.sh.com/",
        path: '/?page=2&limit=3',
        href: 'https://Pharos.sh.com/?page=2&limit=3'
    }
    

    De acuerdo, estamos un poco m谩s cerca de obtener los datos que necesitamos. Pero hay que desglosarlo una vez m谩s. Podemos hacer esto usando el querystring paquete para analizar la cadena de consulta real. Por ejemplo:

    let parsedQs = querystring.parse(parsedUrl.query);
    

    Y finalmente, nuestro parsedQs objeto contiene lo siguiente:

    {
        page: '2',
        limit: '3'
    }
    

    Extracci贸n de par谩metros de ruta

    En cualquier aplicaci贸n web, otra forma com煤n de estructurar sus URL es colocar informaci贸n dentro de la ruta URL real, que simplemente se denominan par谩metros de ruta en Express. Podemos usarlos para estructurar p谩ginas web por informaci贸n / datos, que son especialmente 煤tiles en las API REST.

    La extracci贸n de estos par谩metros de ruta es similar a los par谩metros de consulta. Todo lo que hacemos es tomar el req objeto y recuperar nuestros par谩metros de la params objeto. Bastante simple, 驴verdad?

    Echemos un vistazo a un ejemplo de c贸mo hacer esto en nuestra ruta Express:

    // Route to return all articles with a given tag
    app.get('/tag/:id', async function(req, res) {
        
        // Retrieve the tag from our URL path
        var id = req.params.id;
    
        let articles = await Article.findAll({tag: id}).exec();
    
        res.render('tag', {
            articles: articles
        });
    });
    

    Lo primero que debe notar es que le decimos a Express que nuestra ruta es /tag/:id, d贸nde :id es un marcador de posici贸n para cualquier cosa. Podr铆a ser una cadena o un n煤mero. Entonces, cualquier cosa que se pase en esa parte de la ruta se establece como id par谩metro.

    Si tuvi茅ramos que navegar a la URL https://Pharos.sh.com/tag/node luego id ser铆a node, y obtendr铆amos un mont贸n de art铆culos que tienen la node etiqueta en ellos. Y req.params en este caso ser铆a {id: 'node'}, al igual que el query objeto.

    Como puede ver, nuevamente tomamos nuestro par谩metro directamente de un objeto contenido dentro del objeto de solicitud.

    Conclusi贸n

    En este art铆culo present茅 formas de extraer tanto los par谩metros de la cadena de consulta como los par谩metros de ruta de ruta de una URL en el marco web Express. Aqu铆 hay un resumen r谩pido de c贸mo extraer los par谩metros de los que hablamos:

    • req.query: accede directamente a los par谩metros de la cadena de consulta analizados
    • req.params: accede directamente a los par谩metros de ruta analizados desde la ruta

    Si bien el acto real de recuperar estos datos es muy simple, comprender de d贸nde proviene esta informaci贸n y qu茅 es puede ser confuso para algunos principiantes. Esperamos que este art铆culo te aclare algunas cosas. No dude en informarnos en los comentarios si hay algo que no est茅 claro.

    Etiquetas:

    Deja una respuesta

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