Node.js — программная платформа, основанная на движке V8. (транслирующем JavaScript в машинный код), превращающая JavaScript из узкоспециализированного языка в язык общего назначения
Wikipedia
Доброго времени суток, друзья.
Поговорим сегодня о Node.js, а конкретнее о разработке статического сервера, который будет отдавать нам index.html по всем роутам. Это задача базового уровня, поэтому данный материл предназначен именно для начинающих разработчиков, которые только осваивают Node.js. В этой статье я буду идти от простого к сложному и постараюсь преподнести информацию наиболее подробным образом. Если вы еще не сталкивались с установкой Node.js и npm и вам необходимо написать HTTP Server, то следуйте инструкциям ниже.
Установка NodeJS
Для работы нам понадобится сама Node.js, установить ее можно, используя официальный сайт https://nodejs.org/en/
На сайте предлагается две версии для скачивания: LTS и Current(последняя), из которых можно выбрать любую, т.к это не повлияет на дальнейшую разработку. После скачивания дистрибутива, запустите установку. Чтобы проверить, что установка была произведена корректно, введите в консоли команду node -v, в качестве подтверждения терминал укажет установленную версию Node.js
Пример:
node -v
v12.14.0
NPM и создание package.json
В рабочей директории создадим новую папку и назовем ее http-server. Для работы c пакетами понадобится npm. Если у вас не установлен npm, то инсталлировать его можно, используя следующую команду: npm install npm@latest -g
Далее требуется создать файл package.json — для этого введите команду: npm init. В результате будет вызван bin npm — консольное приложение, через которое можно получить package.json. Вам будет предложен ряд вопросов, отвечая на которые вы cконфигурируете конечный файл.
Вот пример уже готового package.json
{
"name": "http-server",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "git+https://github.com/Web-Tricks-Master/node-http-server.git"
},
"keywords": [
"node",
"http-server"
],
"author": "Kalachev Vlad",
"license": "ISC",
"bugs": {
"url": "https://github.com/Web-Tricks-Master/node-http-server/issues"
},
"homepage": "https://github.com/Web-Tricks-Master/node-http-server#readme"
}
Файл server.js
Весь основной код мы будем писать в файле server.js. Для этого в корне проекта создадим файл с названием server.js, написав в нем следующий код:
console.log(‘Hello Node’);
Чтобы выполнить код данного файла, необходимо вызвать его через Node.js. В корне проекта в терминале вызовем команду: node server.js
Пример:
node server.js
// Hello Node
Hello World Server
Напишем первый сервер на Node.js c получением реального ответа по указанному адресу c телом в виде текста: Hello World!
Пример:
// server.js
const http = require('http');
http.createServer((req, res)=> {
res.writeHead(200, {'Content-Type': 'text/plain'});
res.end('Hello World!');
}).listen(8080);
В указанном примере мы импортируем модуль http, с которым будем работать в дальнейшем. Для создания http сервера воспользуемся методом createServer, в первом аргументе которого пишем функцию (в примере использован синтаксис стрелочной функции, но можно также писать данный код с помощью function). Функция принимает два параметра: req и res (можно присваивать наименования по желанию). Первый параметр хранит всю информацию о входящем запросе, второй используется для отправки ответов серверу. В строке res.writeHead в ответе сервера добавляем статус 200 (запрос выполнен успешно) и вторым параметром тип контента (здесь достаточно указать, что мы возвращаем текст).
В строке res.end указываем само тело ответа. После того как сервер был создан, воспользуемся методом listen, чтобы развернуть входящее подключение по нужному нам адресу. Метод listen имеет три аргумента, первый из них отвечает за порт, второй — за локальный адрес, третий является функцией, которая вызывается после старта сервера. В примере мы используем только первый параметр, второй будет назначен по умолчанию, как localhost.
Запустим наш сервер. В консоли наберем команду: node server.js и откроем в браузере адрес http://localhost:8080/ , после чего мы увидим выполнение нашего файла:
Отлично. Вот мы и реализовали наш HelloWorld на Node.js. Давайте усложним нашу систему и добавим работу с файлами, но прежде чуть автоматизируем процесс разработки.
Nodemon
Если попытаться внести изменения в код при развернутом сервере, то окажется, что новые правки не будут отображены. Для решения этой проблемы установим пакет nodemon, который будет следить за вашими изменениями в коде и автоматически перезагружать сервер. В корневой директории проекта введите следующую команду: npm i -D nodemon. Данный пакет нужен только для разработки, поэтому мы устанавливаем его в директорию devDependencies (используем флаг D). После установки пакета добавим в package.json в поле scripts следующие инструкции:
"scripts": {
"start": "node server.js",
"dev": "nodemon server.js"
}
Поле test можно удалить, т.к. мы не будем рассматривать его в данной статье. Теперь для запуска нашего сервера мы будем использовать npm. Чтобы запустить сервис с nodemon, введем команду: npm run dev, для режима демонстрации: npm start или npm run start (также разрешено конвенцией). Продолжим разработку в режиме dev.
HTTP Server
Наша следующая задача отдать сервером html файл, который мы будем загружать нодой. В корне проекта добавим файл index.html.
Пример:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Demo</title>
</head>
<body>
Node HTTP Server
</body>
</html>
В файле server.js напишем следующий код:
const http = require('http');
const fs = require(‘fs');
const path = require('path');
const PORT = 8080;
const server = http.createServer((req, res) => {
res.writeHead(200, {
'Content-Type': 'text/html',
'Expires': '0'
});
fs.createReadStream(path.resolve(__dirname, 'index.html')).pipe(res)
})
server.listen(PORT, '0.0.0.0', () => {
console.log('Server started!');
});
Для работы с файлами в Node.js используется модуль fs, импортируем его. Также, чтобы наше решение работало в разных операционных системах потребуется модуль path, благодаря которому мы сможем писать правильные пути до файлов. Чуть усложним наш метод listen. Вынесем порт в константу, вторым аргументом укажем адрес ‘0.0.0.0’ (он же localhost), и в третий добавим функцию, которая будет вызываться на старте сервера. В res.writeHead укажем статус и заголовок, в котором мы будем отдавать данные (text/html). Строка ‘Expires’: ‘0′ означает, что каждый раз в момент получения ответа сервера мы будем чистить куки (делается это для того, чтобы всегда видеть корректные изменения в html файле без кэширования). В строке fs.createReadStream(path.resolve(__dirname, ‘index.html’)).pipe(res) происходит чтение файла из потока в виде стрима и связывание его через метод .pipe с выходящем потоком ответа.
Использование createReadStream является наилучшей практикой (помните, что все зависит от ваших задач и это не серебренная пуля), хотя часто в коде можно увидеть метод readFile. В чем же отличие? Метод readFile, при чтении файла, полностью его загружает и сохраняет в память, после чего начинает с ним работать. Если же файл будет большого размера, то вероятность, что сервер переполнит память очень велика. При использовании метода createReadStream, он создает стрим, в котором файл передается кусками, что позволяет в случае загрузки большого файла не завершать работу приложения, тем самым предотвращая возможность переполнения памяти.
После запуска нашего кода получим следующий результат:
Мы пришли к поставленной цели. Теперь Node.js отдает нам index.html, на основе которого в дальнейшем мы сможем создавать статические сайты.
Заключение
Надеюсь данная статья была вам полезна. Исходный код вы сможете найти тут. Прекрасно понимаю, что для раздачи статики лучше всего использовать nginx как более простое и эффективное решение подобной задачи, но целью данной статьи является разработка именно на Node.js и объяснения базовых тем, на мой взгляд такой пример является более понятным для начинающих разработчиков. Учитесь, думайте, пишите код. Удачного кодинга, друзья!
Полезные ссылки:
https://nodejs.org/en/ — официальный сайт node.js
https://github.com/nodejs — node.js на github
https://www.npmjs.com/ — официальный сайт 7pm
Подписывайтесь на наш канал в Telegram для получения самой последней и актуальной информации.
Комментарии: