Menu
CoddyTech

Respuestas JSON

Parte de la sección Conceptos básicos de Express del Journey de Node.js de Coddy. Lección 6 de 23.

Un programa que llama a tu servidor necesita datos que pueda leer, no una oración.

app.get('/api/weather', (req, res) => {
    res.json({ city: 'Oslo', temp: 4, rain: true });
});

JSON es un formato de texto para objetos y arreglos. res.json(value) convierte el valor en JSON y establece el encabezado Content-Type como application/json; un encabezado es una línea con nombre que se envía junto con la respuesta, y este indica qué tipo de cuerpo viene a continuación. El cliente recibe {"city":"Oslo","temp":4,"rain":true} y lee temp como un número.

res.send con una cadena envía text/html, que un programa tendría que analizar. Las rutas para programas suelen comenzar con /api, así que las páginas y los datos nunca comparten una ruta.

challenge icon

Desafío

Fácil

Los programas, como una aplicación de teléfono, necesitan los datos de Recipe Box en un formato que puedan leer. Añade una API JSON junto a las páginas.

  1. En server.js, añade una ruta para /api/recipes. Envía todo el arreglo recipes como JSON.
  2. Añade una ruta para /api/recipes/:id. Busca la receta como lo hace /recipes/:id y envía todo el objeto de la receta como JSON, no solo su título. Para la receta 2, es el objeto con "id": 2, "title": "Pancakes", "tags": ["breakfast", "sweet"] y sus porciones.
  3. Cuando ninguna receta tenga ese id, responde con el estado 404. Puedes enviar el texto No such recipe, como hace la página.

Pruébalo: Pulsa «Ejecutar» y envía /api/recipes. Deberías ver una lista de cuatro recetas, que empieza con Tomato Soup. Envía /api/recipes/2: el objeto de Pancakes. Envía /api/recipes/99: estado 404. En la pestaña Headers, /api/recipes tiene un Content-Type de application/json. Después, envía /about: su Content-Type es text/html, porque res.send con una cadena envía una página.

Pruébalo tú mismo

import express from 'express';
import { recipes } from './data.js';

const app = express();

app.get('/', (req, res) => {
    res.send('Welcome to Recipe Box');
});

// type('text') envía texto sin formato, por lo que cada título aparece en su propia línea.
app.get('/recipes', (req, res) => {
    const { tag } = req.query;
    const list = tag ? recipes.filter((recipe) => recipe.tags.includes(tag)) : recipes;
    res.type('text').send(list.map((recipe) => recipe.title).join('\n'));
});

app.get('/recipes/:id', (req, res) => {
    const recipe = recipes.find((r) => r.id === Number(req.params.id));
    if (!recipe) {
        res.status(404).send('No such recipe');
        return;
    }
    res.send(recipe.title);
});

app.get('/about', (req, res) => {
    res.send('Recipe Box collects family recipes.');
});

app.listen(3000, () => {
    console.log('Recipe Box is running on port 3000');
});
quiz iconPonte a prueba

Esta lección incluye un breve cuestionario. Empieza la lección para responderlo y registrar tu progreso.

Todas las lecciones de Conceptos básicos de Express

Practica por tu cuenta: Playground de Express