Servir les fichiers statiques dans Express

Pour servir des fichiers statiques tels que des images, des fichiers CSS et des fichiers JavaScript, utilisez la fonction middleware intégrée express.static dans Express.

La signature de la fonction est :

express.static(root, [options]);

L’argument root spécifie le répertoire racine à partir duquel servir les actifs statiques. Pour plus d’informations sur l’argument options, voir express.static.

Par exemple, utilisez le code suivant pour servir les images, les fichiers CSS et JavaScript dans un répertoire nommé public:

app.use(express.static('public'));

Maintenant, vous pouvez charger les fichiers qui se trouvent dans le répertoire public:

http://localhost:3000/images/kitten.jpg
http://localhost:3000/css/style.css
http://localhost:3000/js/app.js
http://localhost:3000/images/bg.png
http://localhost:3000/hello.html

Pour utiliser plusieurs répertoires statiques, appelez la fonction middleware express.static plusieurs fois :

app.use(express.static('public'));
app.use(express.static('files'));

Express recherche les fichiers dans l’ordre dans lequel vous définissez les répertoires statiques avec la fonction express.static.

Pour créer un préfixe de chemin virtuel (où le chemin n’existe pas dans le système de fichiers) pour les fichiers qui sont servis par le fichier express. fonction tatic, spécifiez un chemin de montage pour le répertoire statique, comme indiqué ci-dessous:

app.use('/static', express.static('public'));

Maintenant, vous pouvez charger les fichiers qui se trouvent dans le dossier public à partir du préfixe de chemin /static.

http://localhost:3000/static/images/kitten.jpg
http://localhost:3000/static/css/style.css
http://localhost:3000/static/js/app.js
http://localhost:3000/static/images/bg.png
http://localhost:3000/static/hello.html

Cependant, le chemin que vous fournissez à la fonction express.static est relatif au répertoire depuis lequel vous lancez votre processus node. Si vous exécutez l’application express à partir d’un autre répertoire, il est plus sûr d’utiliser le chemin absolu du répertoire que vous voulez servir:

const path = require('path');
app.use('/static', express.static(path.join(__dirname, 'public')));

Pour plus de détails sur la fonction serve-static et ses options, voir serve-static.