Maison >interface Web >js tutoriel >Comment héberger des fichiers statiques avec Express

Comment héberger des fichiers statiques avec Express

php中世界最好的语言
php中世界最好的语言original
2018-06-04 09:45:381587parcourir

Cette fois, je vais vous montrer comment utiliser Express pour héberger des fichiers statiques, et quelles sont les précautions pour utiliser Express pour héberger des fichiers statiques. Voici des cas pratiques, jetons un coup d'œil.

Middlewareexpress.static

Lorsque nous utilisons express pour initialiser un répertoire, il sera dans app.js J'ai vu beaucoup d'applications recommandées.

L'un des principaux middlewares est express.static (le middleware toujours conservé dans la version 4.0)

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

Express.static peut nous aider à héberger des fichiers statiques, js, css, img wait.

Utilisation express.static

Utilisation de base

Il y a du CSS sous public dans le projet répertoire, js, img et autres dossiers.

J'ai vraiment besoin de les héberger via Express pour que nous puissions accéder aux données lorsque nous démarrons le serveur.

Ajoutez

var express = require('express');
var app = express();
app.use(express.static('public'));

dans app.js et nous pouvons passer

http://localhost:3000/css/style.css
http:/ / localhost:3000/js/style.js
http://localhost:3000/img/style.png

Remarque :Tous les chemins de fichiers sont relatifs au répertoire de stockage, donc , le nom du répertoire où sont stockés les fichiers statiques n'apparaîtra pas dans l'url.

Répertoire virtuel

Ceci est réalisé en spécifiant un chemin de montage pour le répertoire de ressources statique.

Nous pouvons ajouter un répertoire virtuel à nos fichiers statiques, ce qui nous permet parfois de gérer plus facilement nos URL de manière unifiée, et aussi de voir clairement les attributs des ressources.

var express = require('express');
var app = express();
app.use('static',express.static('public'));

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Comment utiliser Vue pour supprimer le signe # dans le chemin

Comment utiliser Vue pour cliquez sur l'espace vide Implémentation du div caché

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn