Servir des fichiers statiques dans Express

Pour servir des fichiers statiques tels que les images, les fichiers CSS et les fichiers JavaScript, utilisez la fonction de logiciel intermédiaire intégré express.static dans Express.

The function signature is:

express.static(root, [options])

The root argument specifies the root directory from which to serve static assets. For more information on the options argument, see express.static.

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

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

Maintenant, vous pouvez charger les fichiers qui sont 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 actifs, utilisez 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 avez établi les répertoires statiques avec la fonction middleware express.static.

Pour créer un préfixe de chemin d’accès virtuel (dans lequel le chemin d’accès n’existe pas vraiment dans le système de fichiers) pour les fichiers qui sont servis par la fonction express.static, indiquez un chemin de montage pour le répertoire statique, comme démontré ci-dessous :

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

Maintenant, vous pouvez charger les fichiers qui sont dans le répertoire public à partir du préfixe de chemin d’accès /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 d’accès que vous fournissez à la fonction express.static est en rapport avec le répertoire à partir duquel 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 d’accès absolu que vous voulez servir :

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

For more details about the serve-static function and its options, see serve-static.

Previous: Basic Routing     Next: More examples