ExpressJS - Servindo arquivos estáticos
Os arquivos estáticos são arquivos que os clientes baixam como estão do servidor. Crie um novo diretório,public. Express, por padrão não permite que você forneça arquivos estáticos. Você precisa habilitá-lo usando o seguinte middleware integrado.
app.use(express.static('public'));
Note - O Express procura os arquivos relativos ao diretório estático, portanto, o nome do diretório estático não faz parte da URL.
Observe que a rota raiz agora está definida como seu diretório público, portanto, todos os arquivos estáticos que você carregar serão considerados públicos como raiz. Para testar se está funcionando bem, adicione qualquer arquivo de imagem em seu novopublic dir e mude seu nome para "testimage.jpg". Em suas visualizações, crie uma nova visualização e inclua este arquivo como -
html
head
body
h3 Testing static file serving:
img(src = "/testimage.jpg", alt = "Testing Image
Você deve obter a seguinte saída -
Vários diretórios estáticos
Também podemos definir vários diretórios de ativos estáticos usando o seguinte programa -
var express = require('express');
var app = express();
app.use(express.static('public'));
app.use(express.static('images'));
app.listen(3000);
Prefixo de caminho virtual
Também podemos fornecer um prefixo de caminho para servir arquivos estáticos. Por exemplo, se você deseja fornecer um prefixo de caminho como'/static', você precisa incluir o seguinte código em seu index.js arquivo -
var express = require('express');
var app = express();
app.use('/static', express.static('public'));
app.listen(3000);
Agora, sempre que você precisar incluir um arquivo, por exemplo, um arquivo de script chamado main.js residente em seu diretório público, use a seguinte tag de script -
<script src = "/static/main.js" />
Essa técnica pode ser útil ao fornecer vários diretórios como arquivos estáticos. Esses prefixos podem ajudar a distinguir entre vários diretórios.