ExpressJS - Serve file statici

I file statici sono file che i client scaricano così come sono dal server. Crea una nuova directory,public. Express, per impostazione predefinita, non consente di servire file statici. È necessario abilitarlo utilizzando il seguente middleware integrato.

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

Note - Express cerca i file relativi alla directory statica, quindi il nome della directory statica non fa parte dell'URL.

Nota che la rotta di root è ora impostata sulla tua directory pubblica, quindi tutti i file statici che carichi saranno considerati pubblici come root. Per verificare che funzioni correttamente, aggiungi qualsiasi file immagine nel tuo nuovo filepublic dir e cambia il suo nome in "testimage.jpg". Nelle tue visualizzazioni, crea una nuova visualizzazione e includi questo file come -

html
   head
   body
      h3 Testing static file serving:
      img(src = "/testimage.jpg", alt = "Testing Image

Dovresti ottenere il seguente output:

Directory statiche multiple

Possiamo anche impostare più directory di risorse statiche utilizzando il seguente programma:

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

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

app.listen(3000);

Prefisso percorso virtuale

Possiamo anche fornire un prefisso di percorso per servire file statici. Ad esempio, se desideri fornire un prefisso del percorso come'/static', devi includere il seguente codice nel tuo file index.js file -

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

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

app.listen(3000);

Ora ogni volta che è necessario includere un file, ad esempio un file script chiamato main.js che risiede nella directory pubblica, utilizzare il seguente tag script:

<script src = "/static/main.js" />

Questa tecnica può tornare utile quando si forniscono più directory come file statici. Questi prefissi possono aiutare a distinguere tra più directory.