Introduction au middleware express.js (avec exemples)

Le contenu de cet article est une introduction au middleware express.js (avec des exemples). Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

Les nouveaux développeurs express sont souvent confus quant à la différence entre les gestionnaires de routes et le middleware. Ils sont donc également confus quant à la différence entre les méthodes app.use(), app.all(), app.get(), app.post(), app.delete() et app.put().

Dans cet article, j'expliquerai la différence entre le middleware et les gestionnaires de routes. Et comment utiliser correctement les méthodes app.use(), app.all(), app.get(), app.post(), app.delete() et app.put().

Traitement des itinéraires

app.use(), app.all(), app.get(), app.post(), app.delete() et app.put() tous Est utilisé pour définir des itinéraires. Ces méthodes sont utilisées pour définir des itinéraires. Le routage est utilisé pour gérer les requêtes HTTP. Une route est une combinaison d'un chemin et d'un rappel, exécuté lorsque le chemin demandé correspond. Les rappels sont appelés gestionnaires de routes.

La différence entre eux réside dans la gestion de différents types de requêtes HTTP. Par exemple : la méthode app.get() gère uniquement les requêtes get, tandis que app.all() gère les requêtes GET, POST et autres.

Voici un exemple de définition d'une route :

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

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

app.listen(8080);

Chaque gestionnaire de route obtient une référence aux objets de requête et de réponse pour la requête HTTP en cours de traitement.

Plusieurs gestionnaires de routes peuvent être exécutés pour une seule requête HTTP. Voici un exemple :

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

app.get("/", function(req, res, next){
    res.write("Hello");
    next();
});

app.get("/", function(req, res, next){
    res.write(" World !!!");
    res.end();
});

app.listen(8080);

Ici, le premier gestionnaire écrit une réponse puis appelle next(). La méthode next() est utilisée pour appeler le prochain gestionnaire de route qui correspond au chemin de la route.

Le gestionnaire de route doit mettre fin à la demande ou appeler le gestionnaire de route suivant.

Nous pouvons également transmettre plusieurs gestionnaires de route aux méthodes app.all(), app.get(), app.post(), app.delete() et app.put().

Voici un exemple qui démontre ceci :

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

app.get("/", function(req, res, next){
    res.write("Hello");
    next();
}, function(req, res, next){
    res.write(" World !!!");
    res.end();
});

app.listen(8080);

Middleware

Le middleware est un rappel qui se trouve au-dessus du gestionnaire de requêtes réel. Il prend les mêmes paramètres que le gestionnaire de route.

Pour comprendre le middleware, regardons un exemple de site avec les pages dashboard et profile. Pour accéder à ces pages, les utilisateurs doivent être connectés. Les demandes pour ces pages sont également enregistrées.

Voici le code du gestionnaire de route pour ces pages :

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

function checkLogin(){
    return false;
}

function logRequest(){
    console.log("New request");
}

app.get("/dashboard", function(req, res, next){

    logRequest();

    if(checkLogin()){
        res.send("This is the dashboard page");
    }
    else{
        res.send("You are not logged in!!!");
    }
});

app.get("/profile", function(req, res, next){

    logRequest();

    if(checkLogin()){
        res.send("This is the dashboard page");
    }
    else{
        res.send("You are not logged in!!!");
    }
});

app.listen(8080);

Le problème ici est qu'il y a beaucoup de code en double, c'est-à-dire que nous devons utiliser logRequest() et checkLogin() Fonction plusieurs fois. Cela rend également la mise à jour du code difficile. Ainsi, pour résoudre ce problème, nous pouvons écrire un chemin commun pour ces deux chemins.

Voici le code réécrit :

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

function checkLogin(){
    return false;
}

function logRequest(){
    console.log("New request");
}

app.get("/*", function(req, res, next){
    logRequest();
    next();
})

app.get("/*", function(req, res, next){
    if(checkLogin()){
        next();
    }
    else{
        res("You are not logged in!!!");
    }
})

app.get("/dashboard", function(req, res, next){
    res.send("This is the dashboard page");
});

app.get("/profile", function(req, res, next){
    res.send("This is the dashboard page");
});

app.listen(8080);

Le code ici semble plus propre et plus facile à maintenir et à mettre à jour. Les deux premiers gestionnaires de routes définis sont ici appelés middleware car ils ne gèrent pas les requêtes mais sont responsables du prétraitement des requêtes.

Express nous fournit la méthode app.use(), qui est spécifiquement utilisée pour définir le middleware. La méthode app.use() peut ressembler à app.all(), mais il existe de nombreuses différences entre elles qui rendent app.use() bien adaptée à la déclaration de middleware. Voyons comment fonctionne la méthode app.use() :

La différence entre app.use() et app.all() :

CALLBACK

app use(. ) ne nécessite qu'un seul rappel, tandis que app.all() peut effectuer plusieurs rappels.

PATH

app.use() vérifie uniquement si l'URL commence par le chemin spécifié et app.all() correspond au chemin complet.

Voici un exemple pour illustrer :

app.use( "/product" , mymiddleware);
// will match /product
// will match /product/cool
// will match /product/foo

app.all( "/product" , handler);
// will match /product
// won't match /product/cool   <-- important
// won't match /product/foo    <-- important

app.all( "/product/*" , handler);
// won't match /product        <-- Important
// will match /product/cool
// will match /product/foo

NEXT()

next() dans un middleware appelle le prochain middleware ou gestionnaire de route, en fonction de celui déclaré ensuite . Mais next() dans le gestionnaire de route appelle uniquement le gestionnaire de route suivant. S'il y a ensuite un middleware, ignorez-le. Par conséquent, le middleware doit être déclaré avant tous les gestionnaires de routes.

Voici un exemple pour illustrer :

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

app.use(function frontControllerMiddlewareExecuted(req, res, next){
  console.log('(1) this frontControllerMiddlewareExecuted is executed');
  next();
});

app.all('*', function(req, res, next){
  console.log('(2) route middleware for all method and path pattern "*", executed first and can do stuff before going next');
  next();
});

app.all('/hello', function(req, res, next){
  console.log('(3) route middleware for all method and path pattern "/hello", executed second and can do stuff before going next');
  next();
});

app.use(function frontControllerMiddlewareNotExecuted(req, res, next){
  console.log('(4) this frontControllerMiddlewareNotExecuted is not executed');
  next();
});

app.get('/hello', function(req, res){
  console.log('(5) route middleware for method GET and path patter "/hello", executed last and I do my stuff sending response');
  res.send('Hello World');
});

app.listen(80);

Nous voyons maintenant le caractère unique de la méthode app.use() et pourquoi elle est utilisée pour déclarer un middleware.

Réécrivons notre exemple de code de site :

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

function checkLogin(){
    return false;
}

function logRequest(){
    console.log("New request");
}

app.use(function(req, res, next){
    logRequest();
    next();
})

app.use(function(req, res, next){

    if(checkLogin()){
        next();
    }
    else{
        res.send("You are not logged in!!!");
    }
})

app.get("/dashboard", function(req, res, next){
    res.send("This is the dashboard page");
});

app.get("/profile", function(req, res, next){
    res.send("This is the dashboard page");
});

app.listen(8080);

Cet article est partout ici Pour un contenu plus passionnant, vous pouvez prêter attention au site Web PHP chinois Didacticiel vidéo JavaScript. rubrique !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!