# Файлы ресурсов в NodeJS

Давайте теперь научимся отдавать браузеру файлы ресурсов. Под ресурсами понимаются файлы картинок, файлы CSS стилей, файлы клиентских скриптов и так далее.

Давайте рассмотрим работу с ресурсами на примере картинок. Пусть, например, по адресу `/page.html` мы хотим отдавать HTML файл, а по адресу `/image.png` - картинку.

Сделаем это:

`http.createServer(async (request, response) => { if (request.url != '/favicon.ico') { let data; let type; if (request.url === '/page.html') { data = await fs.promises.readFile('page.html', 'utf8'); type = 'text/html'; } if (request.url === '/image.png') { data = await fs.promises.readFile('image.png'); type = 'image/png'; // правильно укажем mime-тип } response.writeHead(200, {'Content-Type': type}); response.write(data); response.end(); } }).listen(3000);`

Создайте файл `styles.css`. Отдайте его по соответствующему запросу. Не забудьте правильно указать тип данных.

Создайте файл `script.js`. Отдайте его по соответствующему запросу. Не забудьте правильно указать тип данных.

Разместите у себя файл с фавиконкой, назвав его `favicon.ico`. Уберите в вашем коде условие для блокировки двойного запроса, а вместо этого отдавайте корректную фавиконку.

## Автоматические запросы браузера

Рассмотрим следующую HTML страницу:

`<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>my page</title> <link rel="stylesheet" href="styles.css"> <script src="script.js"></script> </head> <body> <p> my first page on NodeJS </b> <img src="img.png"> </body> </html>`

Как вы видите, на данной странице подключается CSS файл, JavaScript файл, а также картинка. Это значит, что когда браузер получит и прочитает HTML код нашей страницы, он автоматически отправит серверу еще `3` запроса для получения указанных файлов.

Скопируйте приведенный код HTML страницы и разместите его в файле. Отдайте этот файл браузеру по соответствующему запросу. Сделайте так, чтобы браузер получил запрошенные им файлы ресурсов, на которые ссылается наша HTML страница.

← →
↑