Перейти к содержанию

Статические файлы и функция static()

Для того чтобы Node.js сервер мог передавать по запросу находящиеся у него статические файлы (изображения, аудио, HTML, CSS, JS), используется функция фреймворка Express static().

Добавьте перед определением всех маршрутов следующий код.

1
app.use(express.static(`${__dirname}/assets`));

Функция должна вызываться как Middleware с использованием метода use(). В качестве параметра Express static() принимает имя директории, в которой находятся все статические файлы, но при запросе самих файлов указывать в URL директорию не нужно. Поиск будет осуществляться относительно указанной директории.

Например, запрашивается следующий файл CSS.

1
http://127.0.0.1/img/logo.svg

Когда сервер Node.js получает запрос, он определяет, что это статический файл, а функция Express static() уже сама знает, что его необходимо искать в директории assets.

В приведенном выше коде использования Express static(), задается абсолютное расположение директории assets с помощью переменной __dirname, поскольку без нее путь будет формироваться относительно того места, из которого был запущен процесс Node.js.

Express static() может использоваться неограниченное количество раз. Например, если у вас имеется две директории со статическими файлами и обращение к ним должно происходить в зависимости от запрашиваемого URL, то используется следующая запись.

1
2
3
4
5
6
7
8
app.use(
    '/photos',
    express.static(`${__dirname}/assets/img`)
);
app.use(
    '/styles',
    express.static(`${__dirname}/assets/css`)
);

Здесь первым параметром методу use() передается начало URL, по которому будут запрашиваться файлы, а вторым параметром - место, где нужно будет его искать.

Пример запросов.

1
2
http://127.0.0.1/photos/admin.png
http://127.0.0.1/styles/app.css

Чтобы в ответ были возвращены запрашиваемые файлы admin.png и app.css, они должны находиться по пути /assets/img/admin.png и /assets/css/app.css соответственно.

Пример Node.js сервера с использованием Express static() для отдачи статических файлов.

app.js

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
const express = require('express');
const app = express();

const host = '127.0.0.1';
const port = 7000;

app.use(
    '/uploads',
    express.static(`${__dirname}/assets/images`)
);
app.use('/styles', express.static(`${__dirname}/css`));

app.listen(port, host, function () {
    console.log(`Server listens http://${host}:${port}`);
});

Так, при запросе

1
http://127.0.0.1/uploads/logo.svg

должен вернуться файл, который физически находится по пути /assets/images/logo.svg.

Комментарии