NodeJS + Express partie 2 : Route Parameters

Voici une série d'articles qui vous permettra créer des applications backend avec NodeJS + Express.

Cette série est la suite de ma série sur les bases de NodeJS. Si vous n'avez pas les connaissances de bases en NodeJS lisez cette série d'abord : Introduction à NodeJS

Node.js est aujourd'hui un incontournable, il est donc essentiel pour un développeur de le maitriser.

Je vais donc publier un nouvel article environ au deux jours et petit à petit vous apprendrez tout ce qu'il y a à savoir sur Node.js + Espress

Pour ne rien manquer suivez moi sur twitter : https://twitter.com/EricLeCodeur

---

Données provenant d'un fichier de données JSON

Dans une application réelle, les données ne seront pas envoyées directement dans le res.json(). Les données seront lues à partir d'une base de données.

Pour les exemples suivants, nous allons créer une base de données texte JSON pour aider à imiter ce scénario.

Créez un nom de fichier data.js et copiez/collez ce code

const products = [
    { id: 1, name: 'iPhone', price: 800 },
    { id: 2, name: 'iPad', price: 650 },
    { id: 3, name: 'iWatch', price: 750 }
]

module.exports = products

Changez le app.get() pour envoyer les données des produits

const express = require('express')
const app = express()
const products = require('./data.js')

app.listen(5000, () => {
    console.log('server is listening on port 5000')
})

app.get('/api/products', (req, res) => {
    res.json(products)
})

Ce code renverra tout le contenu des produits.

Parfois, il peut être pratique de ne renvoyer qu'une partie des produits. Par exemple certains champs peuvent être confidentiels.

Voici un exemple retournant tout sauf le prix

app.get('/api/products', (req, res) => {
    const partial_products = products.map(product => {
        return { id: product.id, name: product.name }
    })
    res.json(partial_products)
})

Route Parameters

Que se passe-t-il si vous souhaitez charger uniquement le produit avec l'ID #1. La convention veut que le chemin URL soit quelque chose comme : api/products/1

Espress a un moyen simple de gérer ce genre de demande

app.get('/api/products/:productID', (req, res) => {
    const id = Number(req.params.productID)
    const product = products.find(product => product.id === id)
    res.json(product)
})

Notez le :productID dans l'URL de la route. Le :productID est un "wildcard" pour mettre le contenu après le 'api/products/' ex: api/products/1

Le productID peut être récupéré à partir de votre demande avec le req.params.productID

Qu'est-ce qui s'ajoute si la demande contient un identifiant qui n'est pas dans les données. ex : 'api/produits/1080' ? Rien ne sera affiché.

Par convention dans cette situation, nous renvoyons un statut 404 Not Found

app.get('/api/products/:productID', (req, res) => {
    const id = Number(req.params.productID)
    const product = products.find(product => product.id === id)

        if (!product) {
        return res.status(404).send('Product not found')
    }
    res.json(product)
})

Query String

Il est courant qu'une API autorise l'utilisateur à faire une requête de recherche. Par exemple si un utilisateur veut tous les produits dont le nom contient le mot "phone" il peut envoyer cette demande

GET api/query/?name=phone

Comme tout le reste, Express dispose d'un moyen simple de récupérer les données de la chaîne de requête. Nous pouvons utiliser le "req.query" pour récupérer la chaîne de requête.

app.get('/api/query', (req, res) => {
    const name = req.query.name.toLowerCase()
    const products_result = products.filter(product => product.name.toLowerCase().includes(name))

    if (products_result.length < 1) {
        return res.status(200).send('No products matched your search')
    }
    res.json(products_result)
})

const name = req.query.name.toLowerCase() a récupéré la chaîne de requête nommée "name" à partir de l'URL et la convertit en minuscules.

Ensuite, nous n'avons qu'à filtrer notre liste de produits sur cette valeur pour obtenir les products_results

Conclusion

C'est tout pour aujourd'hui, suivez moi sur twitter : https://twitter.com/EricLeCodeur afin d'être avisé de la parution du prochain article (d'ici deux jours).