Поиск по сайту:

Как начать работу с Node.js и Express

Введение

Express — это инфраструктура веб-приложений для Node.js, которая позволяет создавать надежные API и веб-серверы гораздо проще и чище. Это легкий пакет, который не закрывает основные функции Node.js.

В этой статье вы установите и используете Express для создания веб-сервера.

Предпосылки

Если вы хотите следовать этой статье, вам понадобятся:

  • Локальная среда разработки для Node.js. Следуйте инструкциям по установке Node.js и созданию локальной среды разработки.

Это руководство было проверено с помощью Node v15.14.0, npm v7.10.0, express v4.17.1 и serve-index v1.9.1.

Шаг 1 — Настройка проекта

Сначала откройте окно терминала и создайте новый каталог проекта:

  1. mkdir express-example

Затем перейдите во вновь созданный каталог:

  1. cd express-example

На этом этапе вы можете инициализировать новый проект npm:

  1. npm init -y

Далее вам нужно будет установить пакет express:

  1. npm install express@4.17.1

На данный момент у вас есть новый проект, готовый к использованию Express.

Шаг 2 — Создание экспресс-сервера

Теперь, когда Express установлен, создайте новый файл server.js и откройте его в редакторе кода. Затем добавьте следующие строки кода:

const express = require('express');

const app = express();

Первая строка здесь — получение основного модуля Express из установленного вами пакета. Этот модуль представляет собой функцию, которую мы затем запускаем во второй строке, чтобы создать нашу переменную app. Таким образом вы можете создать несколько приложений, каждое со своими запросами и ответами.

const express = require('express');

const app = express();

app.get('/', (req, res) => {
  res.send('Successful response.');
});

В этих строках кода мы сообщаем нашему серверу Express, как обрабатывать запрос GET на наш сервер. Express включает аналогичные функции для POST, PUT и т. д. с использованием app.post(...), app.put(. ..) и т. д.

Эти функции принимают два основных параметра. Первый — это URL-адрес, по которому эта функция будет действовать. В данном случае мы нацеливаемся на /, который является корнем нашего веб-сайта: в данном случае localhost:3000.

Второй параметр — это функция с двумя аргументами: req и res. req представляет запрос, отправленный на сервер; Мы можем использовать этот объект для чтения данных о том, что запрашивает клиент. res представляет собой ответ, который мы отправим обратно клиенту.

Здесь мы вызываем функцию res для отправки ответа: Successful response..

const express = require('express');

const app = express();

app.get('/', (req, res) => {
  res.send('Successful response.');
});

app.listen(3000, () => console.log('Example app is listening on port 3000.'));

Наконец, после того, как мы настроили наши запросы, мы должны запустить наш сервер! Мы передаем 3000 в функцию listen, которая сообщает приложению, какой порт прослушивать. Функция, передаваемая в качестве второго параметра, является необязательной и запускается при запуске сервера. Это дает нам некоторую обратную связь в консоли, чтобы знать, что наше приложение работает.

Вернитесь в окно терминала и запустите приложение:

  1. node server.js

Затем откройте localhost:3000 в веб-браузере. В окне браузера отобразится: Успешный ответ. В окне терминала появится: Пример приложения прослушивает порт 3000.

И вот он у нас есть, веб-сервер! Однако мы определенно хотим отправить клиенту больше, чем одну строку текста. Давайте кратко рассмотрим, что такое промежуточное ПО и как настроить этот сервер как статический файловый сервер!

Шаг 3 — Использование промежуточного программного обеспечения

С помощью Express мы можем писать и использовать функции промежуточного программного обеспечения, которые имеют доступ ко всем HTTP-запросам, поступающим на сервер. Эти функции могут:

  • Выполнить любой код.
  • Внесите изменения в объекты запроса и ответа.
  • Завершить цикл запрос-ответ.
  • Вызовите следующую функцию промежуточного слоя в стеке.

Мы можем написать свои собственные функции промежуточного программного обеспечения или использовать стороннее промежуточное программное обеспечение, импортируя их так же, как и любой другой пакет.

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

Чтобы определить промежуточную функцию, мы вызываем app.use() и передаем ей функцию. Вот базовая промежуточная функция для вывода текущего времени в консоль при каждом запросе:

const express = require('express');

const app = express();

app.use((req, res, next) => {
  console.log('Time: ', Date.now());
  next();
});

app.get('/', (req, res) => {
  res.send('Successful response.');
});

app.listen(3000, () => console.log('Example app is listening on port 3000.'));

Вызов next() указывает промежуточному ПО перейти к следующей функции промежуточного ПО, если она есть. Это важно включить в конец нашей функции, иначе запрос застрянет на этом мидлваре.

При желании мы можем передать путь промежуточному программному обеспечению, которое будет обрабатывать запросы только к этому маршруту. Например:

const express = require('express');

const app = express();

app.use((req, res, next) => {
  console.log('Time: ', Date.now());
  next();
});

app.use('/request-type', (req, res, next) => {
  console.log('Request type: ', req.method);
  next();
});

app.get('/', (req, res) => {
  res.send('Successful response.');
});

app.listen(3000, () => console.log('Example app is listening on port 3000.'));

При передаче /request-type в качестве первого аргумента в app.use() эта функция будет выполняться только для запросов, отправленных на localhost:3000/request-type. .

Вернитесь в окно терминала и запустите приложение:

  1. node server.js

Затем откройте localhost:3000/request-type в своем веб-браузере. В окне терминала отобразится временная метка запроса и Тип запроса: GET.

Теперь давайте попробуем использовать существующее промежуточное ПО для обслуживания статических файлов. Express поставляется со встроенной промежуточной функцией: serve-index, для отображения индексного списка наших файлов.

Во-первых, в той же папке, где находится экспресс-сервер, создайте каталог с именем public и поместите туда несколько файлов.

Затем установите пакет serve-index:

  1. npm install serve-index@1.9.1

Сначала импортируйте пакет serve-index в начало файла сервера.

Затем включите промежуточное ПО express.static и serveIndex и сообщите им путь доступа и имя каталога:

const express = require('express');
const serveIndex = require('serve-index');

const app = express();

app.use((req, res, next) => {
  console.log('Time: ', Date.now());
  next();
});

app.use('/request-type', (req, res, next) => {
  console.log('Request type: ', req.method);
  next();
});

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

app.get('/', (req, res) => {
  res.send('Successful response.');
});

app.listen(3000, () => console.log('Example app is listening on port 3000.'));

Теперь перезапустите сервер и перейдите к localhost:3000/public. Вам будет представлен список всех ваших файлов!

Заключение

В этой статье вы установили и использовали Express для создания веб-сервера. Вы также использовали встроенные и сторонние функции промежуточного программного обеспечения.

Продолжите свое обучение с Как определить маршруты и методы HTTP-запросов в Express.