תגובות JSON

חלק מהיחידה יסודות Express במסלול ה-Node.js של Coddy. שיעור 6 מתוך 23.

תוכנית שפונה לשרת שלך זקוקה לנתונים שהיא יכולה לקרוא, ולא למשפט.

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

JSON הוא פורמט טקסט לאובייקטים ולמערכים. res.json(value) הופכת את הערך ל-JSON ומגדירה את הכותרת Content-Type ל-application/json; כותרת היא שורה בעלת שם שנשלחת עם התגובה, והשורה הזו מציינת איזה סוג של גוף מופיע אחריה. הלקוח מקבל את {"city":"Oslo","temp":4,"rain":true} וקורא את temp כמספר.

res.send עם מחרוזת שולחת text/html, שתוכנית תצטרך לנתח. נתיבים עבור תוכניות מתחילים בדרך כלל ב-/api, כך שדפים ונתונים לעולם אינם חולקים נתיב.

אתגר

קל

תוכניות, כמו אפליקציה בטלפון, צריכות את הנתונים של Recipe Box בפורמט שהן יכולות לקרוא. הוסיפו API של JSON לצד הדפים.

ב־server.js, הוסיפו נתיב עבור /api/recipes. הוא שולח את כל מערך recipes כ־JSON.
הוסיפו נתיב עבור /api/recipes/:id. הוא מוצא את המתכון כפי שעושה /recipes/:id, ושולח את כל אובייקט המתכון כ־JSON, ולא רק את הכותרת שלו. עבור מתכון 2, זהו האובייקט עם "id": 2, "title": "Pancakes", "tags": ["breakfast", "sweet"] ומספר המנות שלו.
כשאין מתכון עם המזהה הזה, החזירו סטטוס 404. אפשר לשלוח את הטקסט No such recipe, כפי שעושה הדף.

נסו זאת: לחצו על Run ושלחו /api/recipes. אמורה להופיע רשימה של ארבעה מתכונים, שמתחילה ב־Tomato Soup. שלחו /api/recipes/2: אובייקט Pancakes. שלחו /api/recipes/99: סטטוס 404. בכרטיסייה Headers, ל־/api/recipes יש Content-Type מסוג application/json. לאחר מכן שלחו /about: ה־Content-Type שלו הוא text/html, משום ש־res.send עם מחרוזת שולח דף.

נסו בעצמכם

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

const app = express();

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

// type('text') שולח טקסט פשוט, כך שכל כותרת מופיעה בשורה נפרדת.
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');
});